Файл: Директор Даронь Владимир Игоревич 7.doc

-Требования к расположению работника за компьютером нацелены на обеспечение его комфорта в течение всей рабочей смены и отсутствие негативных следствий длительной работы. Они действуют для любых рабочих мест, будь то бухгалтерия, обучающий класс или кабинет информатики. Они включают следующие правила:

полная опора ступнями на пол при посадке;
использование компьютерной мебели, отвечающей нормам СанПиН 2.2.2/2.4.1340-03;
отказ от скрещивания конечностей, способного затруднить кровообращение;
соблюдение расстояние до монитора компьютера не меньше 45 сантиметров;
правильная установка освещения, которое не должно светить в глаза и оставлять блики на рабочем мониторе.

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

13.Режим труда и отдыха:

-Длительность непрерывного труда и отдыха для сотрудников, постоянно работающих за персональной офисной техникой, регламентирована на законодательном уровне. Соответствующие нормы приводятся в СанПиН 2.2.2/2.4.1340-03, который устанавливает обязательную продолжительность перерывов в такой работе. Они зависят от длины рабочей смены сотрудника и определяются так:

при 8-часовой рабочей смене в зависимости от тяжести и напряженности труда работника общая продолжительность перерывов за рабочий день должна составлять от 50 до 90 минут;
при 12-часовой рабочей смене – от 80 до 140 минут.

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

-Продолжительность указанных перерывов согласно действующему Трудовому кодексу включается в общую длительность рабочего времени: рабочий день сотрудника не продлевается за счет таких периодов отдыха. Также в этом время сотрудник не может привлекаться к другой работе. В дополнение к этим перерывам ему предоставляется стандартное время для обеда.

Выполнение индивидуального задания

(описание задания и хода его выполнения)

Проектирование Дизайна
Данный дизайн я начал разрабатывать так чтобы пользователю было легко ориентироваться в нем,и удобно было просматривать.Дизайн должен быть простым ,понятным чтобы пользователь чувствовал себя комфортно.Так же по маштабам дизайн должен быть не нагружен и так же легкодоступным понять его.Дизайн должен быть сделать только на HTML И CSS c препроцессорами.
Реализация дизайна:
Для разработки дизайна я воспользовался таким редактором как Visual Studio Code от компании Microsoft.

Visual Studio Code – это один из наиболее популярных редакторов кода,

разработанный корпорацией Microsoft. Он распространяется в бесплатном

доступе и поддерживается всеми актуальными операционными системами:

Windows, Linux и macOS. VS Code представляет собой обычный текстовый

редактор с возможностью подключения различных плагинов, что дает

возможность работать со всевозможными языками программирования для

разработки любого IT-продукта.

Этот редактор я выбрал потому что он мне понравился тем,что он очень удобный,множество настроек (как всей программы, так и интерфейса),расширяемая библиотека дополнений и готовых решений,мультифункциональность (редактор поддерживает почти все языки, используемые для создания приложений),простота и гибкость.

Рисунок 1 – Страница “Главная”

Это главная страница дизайна всего макета.На нем есть Шапка(Header) для того чтобы переводить на другие страницы.

Рисунок 2 – Страница “ Локация”

На странице “ Каталог” находится перечень информации и локации.

Карточка товара:

Рисунок 3 – Страница “Карточка Епизодов”

На странице “Карточки эпизодов” расположена информация о эпизодах и событиях.

Адаптив страницы:

Адаптив главной страницы

Адаптив страницы “Эпизоды”

Адаптив сьраницы “Локации”

Реализация дизайна с использованием HTML,CSS,JS,и препроцессоров.

Этот дизайн полностью адаптивный и гибкий.

На этом дизайне тоже есть шапка(header) с ссылками на разные страницы и футер(footer) с констактной информацией,с сервисом,с меню и с социальными сетями.
При адаптации(изменеии ширины экрана) под разные устройства все эти блоки подстраиваются под размер этих устройств.
Меню скрытия навигации:

-
Скрипт js скрытия меню:

Список используемой литературы
Документация Html -https://doka.guide/html/

Документация Html -https://doka.guide/css/

Документация JS - https://doka.guide/js/ https://learn.javascript.ru

Документация Node.js -

https://doka.guide/tools/bundlers/

https://habr.com/ru/post/514838/

Документация React - https://ru.react.js.org

Приложения

Приложение Г

Приложение Д

Стили:
/* html*/

html{

box-sizing: border-box;

}

*, *::before, *::after{

box-sizing: inherit;

}

/* body*/

.body{

font-style: normal;

font-size: 15px;

line-height: 1.2;

font-weight: normal;

}

/* navbar start */

.navbar-container {

width: 100%;

max-width: 1230px;

margin: 0 auto;

height: 100%;

padding: 0 15px;

}

.navbar {

position: absolute;

left: 0;

top: 0;

width: 100%;

height: 75px;

box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 0.1);

}

.navbar__wrap {

display: flex;

justify-content: space-between;

height: 100%;

}

.hamb {

display: none;

}

Адаптив:
/* media start */

@media (max-width: 1000px) {

.form{

display: grid;

grid-template-columns: repeat(3,1fr);

justify-items: center;

}

.form__input{

margin-bottom: 30px;

}

.container-sanchezz{

display: grid;

grid-template-columns: repeat(3,1fr);

justify-items: center;

}

.container-sanchez{

display: grid;

grid-template-columns: repeat(3,1fr);

justify-items: center;

}

.sanchez-container{

margin-bottom: 30px;

}

.form__inputs{

margin-bottom: 30px;

}

}
@media (max-width: 770px) {

.form{

display: grid;

grid-template-columns: repeat(2,1fr);

justify-items: center;

}

.container-sanchezz{

display: grid;

grid-template-columns: repeat(2,1fr);

justify-items: center;

}

.container-sanchez{

display: grid;

grid-template-columns: repeat(2,1fr);

justify-items: center;

}

}
Подключение JS:

const popup = document.querySelector("#popup");

const body = document.body;

// Клонируем меню, чтобы задать свои стили для мобильной версии

const menu = document.querySelector("#menu").cloneNode(1);

// При клике на иконку hamb вызываем ф-ию hambHandler

hamb.addEventListener("click", hambHandler);

// Выполняем действия при клике ..

function hambHandler(e) {

e.preventDefault();

// Переключаем стили элементов при клике

popup.classList.toggle("open");

hamb.classList.toggle("active");

body.classList.toggle("noscroll");

renderPopup();

}

// Здесь мы рендерим элементы в наш попап

function renderPopup() {

popup.appendChild(menu);

}

// Код для закрытия меню при нажатии на ссылку

const links = Array.from(menu.children);

// Для каждого элемента меню при клике вызываем ф-ию

links.forEach((link) => {

link.addEventListener("click", closeOnClick);

});

// Закрытие попапа при клике на меню

function closeOnClick() {

popup.classList.remove("open");

hamb.classList.remove("active");

body.classList.remove("noscroll");

}

РКСИ.ПП22.09.02.03.3611