import { getTextForModal } from './getTextForModal.js';

export const createModalElements = () => {
  const $modalMain = document.createElement('div');

  $modalMain.id = 'trainingModalMain';

  $modalMain.innerHTML = `
  <div id="trainingModalBackground">
    <div id="trainingModalContainerHihgtlightes">
      <div id="trainingModalContainer">
        <div id="trainingModalContentContainer">
          <p id="trainingModalCurrentStep">1/6</p>
          <h3 id="trainingModalTitle">Title</h3>

          <div id="trainingModalTextContainer">
            <p id="trainingModalText">Text</p>
          </div>
        </div>

        <button id="nextTrainingModal" class="trainingModalButton">TEST/ТЕСТ</button>
      </div>
    </div>
  </div>`;

  document.body.append($modalMain);
};