[PRAC/cont] Add "add-btn" to DOM

Initial organization of the btn (next modal window) for adding clients.

Worth noting:
  - reasoning about the number of modal windows (total).

core: B-3 / JS-BL

Author: matowdev

core-courses/3-js-basic-level/practicum-js-basic-level/sb-crm-client/css/crm-add.css

@@ -0,0 +1,21 @@
+.crm__add-data {}
+
+.crm__add-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding-right: var(--container-padding);
+  padding-left: var(--container-padding);
+}
+
+.crm__add-btn {
+  border: 1px solid var(--main-purple);
+  padding: 12px 25px;
+  min-width: 217px;
+  /* min-height: 47px; */
+  font-family: var(--open-sans), sans-serif;
+  font-weight: var(--semi-bold);
+  font-size: var(--default-fs);
+  color: var(--main-purple);
+  background: transparent;
+}

core-courses/3-js-basic-level/practicum-js-basic-level/sb-crm-client/css/style.css

@@ -4,4 +4,5 @@
 @import url("crm.css");
 @import url("crm-search.css");
 @import url("crm-output.css");
+@import url("crm-add.css");
 @import url("custom-tippy.css");

core-courses/3-js-basic-level/practicum-js-basic-level/sb-crm-client/js/index.js

@@ -221,6 +221,18 @@
   outputTable.append(outTableHead, outTableBody);
   crmOutputContainer.append(outputTitleWrap, outputTable);
 
+  // организация кнопки/модального окна для добавления клиентов (удаления/изменения)
+  const addBtnWrap = document.createElement('div');
+  const addBtn = document.createElement('button');
+  const addModalWrap = document.createElement('div');
+
+  addBtn.classList.add('crm__add-btn');
+
+  addBtn.textContent = 'Добавить клиента';
+
+  addBtnWrap.append(addBtn, addModalWrap);
+  crmAddContainer.append(addBtnWrap);
+
   // основные блоки/составляющие элементы приложения
   crm.append(crmSearch, crmOutput, crmAdd);