Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.
HTML
<style>
    /* Início estilo banner */
  
    .compositiondani-banner {
      position: relative;
      min-height: 220px;
      border-radius: 5px;
      margin-bottom: 5px;
      overflow: hidden;
    }
  
    .compositiondani-banner-image {
      background-image: url("https://totvscrm.com/wp-content/uploads/2024/04/capa-com-fundo-e-sem-icone-TDN-AZUL2.png");
      background-size: cover;
      min-height: inherit;
      width: 100%;
    }
  
    .compositiondani-banner-overlay {
      min-height: inherit;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border-radius: 5px;
      pointer-events: none;
    }
  
    .compositiondani-banner-logo-container {
      display: flex;
      justify-content: center;
      align-items: center;
      position: absolute;
      top: 50%;
      left: 50%;
      bottom: 0;
      transform: translate(-50%, -50%);
    }
  
    .compositiondani-banner-logo {
      width: 350px;
      height: 180px;
      background-image: url("https://totvscrm.com/wp-content/uploads/2023/09/logo-com-descricao-totvsgc.png");
      background-size: contain;
      background-repeat: no-repeat;
    }
  
    .compositiondani-banner-title {
      margin-bottom: 10px !important;
      padding: 10px !important;
      background: rgba(0, 0, 0, 0.5) !important;
      display: flex !important;
      justify-content: center !important;
      align-items: center !important;
      font-size: 12px !important;
      line-height: 1.3 !important;
      max-height: 133px !important;
      font-family: "Roboto", sans-serif !important;
      -webkit-line-clamp: 3 !important;
      -webkit-box-orient: vertical !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
      color: #ffffff !important;
      position: relative !important;
      margin-top: 130px !important;
      border-radius: 10px !important;
    }
  
    .compositiondani-banner-content {
      position: absolute;
      padding: 30px;
      max-width: 60%;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 1;
      color: white;
      text-align: center;
    }
  
    .custom-header h1 {
      font-size: 16px;
      background-color: rgba(0, 0, 0, 0.6);
      padding: 10px;
      border-radius: 5px;
      margin: 0;
    }
  
    .negrito-materialize {
      font-weight: bold;
    }
  
    .custom-margin-justified {
      margin: 0 20px;
      text-align: justify;
    }
      /* Final estilo banner */

      #content.page.view {
    padding-right: 0 !important;
}   /* impedir vermelho no nav */

#breadcrumb-section > nav {
    background-color: initial !important;
    box-shadow: none !important;
}

@media only screen and (min-width: 601px) {
    nav, 
    nav .nav-wrapper i, 
    nav a.sidenav-trigger, 
    nav a.sidenav-trigger i {
        height: auto !important;
        line-height: normal !important;
    }
}
/* final vermelho no nav */
   </style>
  
  <header>
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400&display=swap" rel="stylesheet"/>
  
    <div class="compositiondani-banner">
      <div class="compositiondani-banner-image"></div>
      <div class="compositiondani-banner-overlay"></div>
      <div class="compositiondani-banner-logo-container">
        <div class="compositiondani-banner-logo"></div>
      </div>
      <div class="compositiondani-banner-content">
        <h1 class="compositiondani-banner-title"> 
          PERFECCIONAMIENTO DEL IMPORTADOR DE DATOS DE PLANIFICACIÓN


  </h1>
  </header>
    </div>
  </div>

  <link
  rel="stylesheet"
  href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css"
/>
<link
  href="https://fonts.googleapis.com/icon?family=Material+Icons"
  rel="stylesheet"
/>
<link
  rel="stylesheet"
  href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"
/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<!-- Inclua o estilo do tema Monokai -->
<link
  rel="stylesheet"
  href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/styles/monokai.min.css"/>
  
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">

<!-- FontAwesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" />

  <style>
  /* ==============================
    =       CONFIGURAÇÕES GERAIS      =
    =============================== */

* {
  font-family: "Roboto", sans-serif;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
}

a {
 
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}

a:hover {
 
}

li {  font-size: 14px !important;
}

h3 {  font-size: 14px !important;
  font-weight: bold;  

}

h1 {  font-size: 13px !important;
  

}

h2 {  font-size: 15px !important;
  font-weight: bold;  

}

td, th {
    padding: 6px;
}

* p {
    margin-bottom: 0 !important;
}

/* ==============================
      =        ESTILOS DE TÍTULOS       =
      =============================== */

#title-text {
  display: none !important;
}

#content > div.page-metadata > div {
    float: none !important;
    line-height: normal !important;
    width: auto !important;
    display: none !important; /* ou outra propriedade de display que você deseja usar */
    margin: 0 !important; /* ou outra propriedade de margin que você deseja usar */
}

#section2 > ol > li:nth-child(2) > p {
    margin-bottom: 0;
}



.wiki-content h1,
.wiki-content h2 {
  font-family: "Roboto", sans-serif !important;
  font-size: 13px!important;
 
}

.wiki-content h1 {
  font-size: 13px !important;
}

.wiki-content h2 {
  font-size: 14px !important;
  color: #42526e !important;
  border-bottom: 2px solid #dfe1e5;
   padding-bottom: 5px;
  font-weight: bold;  
}

.custom-heading,
h3.custom-h3 {
  font-size: 16px;
  color: #42526e;
  margin-bottom: 20px;
}

.custom-h1 {
  color: #feac0e;
}

.explanation h2 {
  font-weight: bold;
}

/* ==============================
      =        ESTILOS DE TEXTO         =
      =============================== */

.wiki-content p {
  font-size: 14px !important;
}

.justificado,
.custom-justified {
  text-align: justify;
  margin: 10px 0;
}

/* ==============================
      =       ESTILOS DE LINKS         =
      =============================== */

.wiki-content a,
.wiki-content a:link,
.wiki-content a:visited,
.wiki-content a:focus,
.wiki-content a:active {
  text-decoration: none;
  color: #42526e;
  font-size: 14px;


}

.wiki-content a:hover {
  color: white;
}

/* ==============================
      =       ESTILOS DE CONTAINER     =
      =============================== */



.custom-content {
  background-color: #f5f5f5;
  padding: 20px;
  border-radius: 8px;
  margin: 0 10px;
  max-width: 100%;
  overflow: hidden;
}

.faq-container {
  max-width: 800px;
  margin: 0 auto;
  padding: 20px;
}

/* ==============================
      =       ESTILOS DE CARDS         =
      =============================== */

.card {
  border: 2px solid #9aa1ad;
  padding: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  background-color: #f4f5f7;
  color: #42526e;
  overflow-x: hidden;
   top: 0;

  
}



/* ==============================
      =       ESTILOS DE TABS          =
      =============================== */

.tabs {
  background-color: #dfe1e5;
}

.tabs .tab a {
  color: rgb(66, 82, 110);
}

.tabs .tab a:hover,
.tabs .tab a.active,
.tabs .tab a:focus.active {
  color: #0897E9;
  background-color: transparent;
}

.tabs .tab a:focus {
  background-color: rgba(8, 151, 233, 0.25);
}

.tabs .tab.disabled a,
.tabs .tab.disabled a:hover {
  color: rgba(16, 148, 184, 0.24);
}

.tabs .indicator {
  background-color: #0897E9;
}

.tab-content {
   gap: 0;
  padding: 10px;
}

.tab-content pre {
  max-width: 100%;
  overflow-x: hidden;
}

/* ==============================
      =        ESTILOS DE ÍCONES        =
      =============================== */

.icon-list,
.icon {
  padding-left: 0;
  list-style-type: none;
}

.icon {
  display: inline-block;
  width: 24px;
  vertical-align: middle;
  margin-right: 45px;
  position: relative;
  left: -25px;
}

.item .label i {
  margin-right: 10px;
}

.label b {
color: #42526e;
}

td th {
color: #42526e;
}

/* ==============================
      =    ESTILOS DE COMPONENTES      =
      =============================== */

.collapsible,
.collapsible-header,
.collapsible-body {
  box-shadow: none !important;
}

.faq-question {
  font-weight: bold;
  margin-bottom: 5px;
}

.faq-answer {
  margin-bottom: 20px;
}





.item {
  display: flex;
  align-items: center;
  padding: 10px;
  border-bottom: 1px solid #eee;
}

.item:last-child {
  border-bottom: none;
}

.item .label {
  flex: 1;
  font-weight: bold;
}

.item .value {
  flex: 1;
  text-align: right;
}
.item {
  border-bottom: 1px solid #e0e0e0;
  padding: 10px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.item:last-child {
  border-bottom: none;
}

/* Estilos para o label */
.label {
  font-weight: bold;
  display: flex;
  align-items: center;
}

.item .label i {
  margin-right: 10px; /* Adiciona espaço depois dos ícones */
}

/* ==============================
      =     ESTILOS DE IMAGENS         =
      =============================== */

.imagem-responsiva {
  max-width: 100%;
  height: auto;
}

.custom-header-bg img {
  width: 100%;
  height: auto;
  display: block;
}

/* ==============================
      =     ESTILOS DE VÍDEO           =
      =============================== */

#youtube-video-container iframe {
  width: 100%;
  height: auto;
  display: block;
}

.video-container {
    max-width: 800px;
    margin: 0 auto;
  }

.ytp-cued-thumbnail-overlay-image {
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 100%;
  position: absolute;
}

/* ==============================
      =    OUTROS ESTILOS PERSONALIZADOS =
      =============================== */
.custom-content {
  background-color: #f5f5f5;
  padding: 20px;
  border-radius: 8px;
  margin: 0 10px;
  max-width: 100%;
  overflow: hidden;
}

.custom-heading {
  font-size: 16px;
  color: #42526e;
  margin: 10px 0;
  border-bottom: 2px solid #e0e0e0;
  padding-bottom: 5px;
  font-weight: bold;  
}

#indice {
  border-radius: 5px;
  padding: 20px;
  max-width: 100%;
  overflow: hidden;
}

#indice h2 {
  text-align: center;
  margin-bottom: 16px;
}

#indice ul {
  list-style-type: none;
  padding-left: 0;
}

#indice li {
  padding: 10px;
  border-bottom: 1px solid #eee;
  cursor: pointer;
  transition: background-color 0.1s ease;
}

#indice li:last-child {
  border-bottom: none;
}

#indice li:hover {
  background-color: #0897E9;
  color: white;
}

/* ==============================
  =      ESTILOS DE TABELAS        =
  ============================== */
.custom-grey {
  background-color: #ffffff;
}

.custom-grey th,
.custom-grey td {
  border: 1px solid #086ea8;
  padding: 10px;
  color:#086ea8
}

.custom-grey tr:nth-child(even) td {
  background-color: #e6e0f7;
}

.custom-grey tr:nth-child(odd) td {
  background-color: #f4f5f7;
}

.custom-grey th {
  color: #fff;
  background-color: #443391;
}



.custom-grey td {
  font-size: 13px;
}

.custom-grey tr:nth-child(odd) {
  background-color: #e4e4e6;
}

.custom-grey tr:nth-child(even) {
  background-color: #dfdfdf;
}

.custom-alert-warning {
  background-color: #fdf1dc; /* ou qualquer outra cor que preferir */
  color: #5c4225; /* cor do texto */
  border: 1px solid #d6800f; /* adicionando borda da mesma cor que o ícone */
  padding: 10px; /* adicione padding conforme necessário */
 
}

.custom-alert-warning .fas {
  color: #5c4225; /* cor do ícone no alerta de aviso */
  margin-right: 10px; /* espaço extra entre o ícone e o texto */
}

.custom-alert-danger {
  background-color: #ffe7ec; /* ou qualquer outra cor que preferir */
  color: #9e1d3b; /* cor do texto */
  border: 1px solid #eb7893; /* adicionando borda da mesma cor que o ícone */
  padding: 10px; /* adicione padding conforme necessário */
  
}

.custom-alert-danger .fas {
  color: #f34b72; /* cor do ícone no alerta de perigo */
  margin-right: 10px; /* espaço extra entre o ícone e o texto */
}


.alert-secondary-custom {
    background-color: #F2EEFF; /* Cor de fundo do alerta */
    color: #3217a7; /* Cor do texto */
    border: 1px solid #9475f7; /* adicionando borda da mesma cor que o ícone */
  padding: 10px; /* adicione padding conforme necessário */
}

.alert-secondary-custom .fas {
    color: #6B48FF; /* Cor dos ícones FontAwesome */
    margin-right: 10px; /* Espaço extra entre o ícone e o texto */
}

.custom-content ul li {
    list-style-type: disc !important; /* Forçando 'bolinhas' */
    padding-left: 30px; /* Espaçamento para alinhar com o texto se necessário */
    margin-bottom: 10px; /* Espaço entre itens da lista se necessário */
}

/* ========== FIM DO ESTILO ========= */

  </style>
  

   





  <!-- Tabs e conteúdo das guias -->
  <div class="card">
    <ul class="tabs">
      <li class="tab col s4"><a href="#tab1">DETALLES FUNCIONALES</a></li>
      <li class="tab col s4"><a href="#tab3">FAQ</a></li>
    </ul>
     <!-- Tab Content -->
 
      <div id="tab1" class="col s12">
        <div class="tab-content">
          <div style="background-color: #f4f5f7; padding: 10px; margin-left: 50px; margin-right: 50px;">
            <section id="section1" style="margin-top: 40px;">
               <!-- Tab 70 conteúdo -->
  <!-- Segundo Card -->

    <!-- Primeiro Card -->
      <!-- Primeiro Card -->
  <div class="card">
    <div class="item">
      <span class="label">
        <table border="1">
          <tr>
              <td><i class="fas fa-tags"></i> <b>Producto:</b></td>
              <td>Gestión de clientes</td>
          </tr>
          <tr>
              <td><i class="fas fa-link"></i> <b>Línea de producto:</b></td>
              <td>TOTVS CRM</td>
          </tr>
          <tr>
              <td><i class="fas fa-chart-pie"></i> <b>Segmento:</b></td>
              <td>Cross Segmentos</td>
          </tr>
          <tr>
              <td><i class="fas fa-desktop"></i> <b>Módulo:</b></td>
              <td>Planificación</td>
          </tr>
          <tr>
              <td><i class="fas fa-globe"></i> <b>Aplicación:</b></td>
              <td>Web</td>
          </tr>
          <tr>
              <td><i class="fas fa-hashtag"></i> <b>Identificador:</b></td>
              <td>
                
                ME300620231438</td>
          </tr>
      </table>
      </span>
    </div>
    </div>
 

      <br>

      <h2 class="custom-heading">
        <i class="fa-solid fa-eye"></i>&nbsp &nbsp VISIÓN GENERAL
      </h2>
      <p class="justificado">
        Se perfeccionó el módulo de Planificación (forecast) en el TOTVS CRM para mejorar significativamente la manera en la cual se manejan y analizan los datos. Se implementaron límites de hasta 5 dimensiones y 24 medidas. Estos cambios se proyectaron para perfeccionar la precisión y la utilidad de los datos utilizados en la planificación, garantizando que las previsiones y análisis sean más confiables y eficaces.









        
        
        
      </p>
<br>

    <h2 class="custom-heading">
      <i class="fa-solid fa-rocket"></i>&nbsp &nbsp OBJETIVO
    </h2>
    <p class="justificado">
      Mejorar la precisión y eficiencia de los datos de planificación en el TOTVS CRM, garantizando una planificación más realista y aplicable. Este abordaje enfocado facilita decisiones estratégicas basadas en análisis confiables y simplificados.









        



    </p>
    <br>

  <!-- ... (seu conteúdo existente) ... -->

               <h2 class="custom-heading">
                <i class="fa-solid fa-book"></i> &nbsp ANTES DE COMENZAR
            </h2>
            <h3>Requisitos</h3>
            <ol>
                <li> <b>Ajustes en los límites:</b> Los usuarios deben ajustar sus configuraciones para alinear con los nuevos límites de dimensiones y medidas.
                   </li>
                                 
            </ol>              
                      
                
          </section>

          <section id="section2" style="margin-top: 40px;">
            <h2 class="custom-heading"><i class="fa-solid fa-star"></i>&nbsp DETALLES FUNCIONALES</h2>
                
              <br>
            <ol>
              <li>
                <p><strong>Limitación de dimensiones y medidas:</strong></p>
                <ul>
                  <li style="list-style-type: disc;"> Se definió que solamente 5 dimensiones y 24 medidas pueden utilizarse en análisis para dejar el proceso más eficiente y orientado. Esta restricción ayuda a enfocarse en los elementos más impactantes y evita la dispersión de la atención en datos menos relevantes.</li>
                </ul>
              
              <li>
                <p><strong>Validación de duplicidad:</strong></p>
              <ul>
                <li style="list-style-type: disc;"> Se implementó una verificación automática para garantizar que las combinaciones de dimensiones sean siempre únicas. Esto evita duplicaciones, sobreposiciones y repeticiones innecesarias, manteniendo la integridad y la calidad de los datos utilizados en la planificación.</li>

              </ul>
             
                </ul>
              </li>
             
            </ol>
            <img src="https://totvscrm.com/wp-content/uploads/2024/04/MOCKUP-TDN-RELEASE-COMPONENTES-COM-NUMERACAODIMENSAO1.png" alt="Limitação de dimensões" title="Limitação de dimensões" style="width: 100%; height: auto; max-width: 100%; display: block;">       
                 
                 
                                      </section>
         
      
            <section id="section3" style="margin-top: 40px;">
              <h2 class="custom-heading"><i class="fa-solid fa-shoe-prints"></i>&nbsp ¿CÓMO UTILIZAR?</h2>
              
              <ol>
                <li><p><strong>Acceda al Módulo de Planificación:</strong></p>
                  <ul>
                    <li style="list-style-type: disc;">Inicie la sesión en el TOTVS CRM.</li> 
                  <li style="list-style-type: disc;">Navegue hasta el módulo de Planificación.</li>
                  </ul>
                </li>
              <li><p><strong>Cree o Acceda a Planificaciones:</strong></p>
                 <ul>
                 <li style="list-style-type: disc;">Haga clic en "Planificaciones" en el menú.</li>
                 <li style="list-style-type: disc;">Seleccione una planificación existente para editar o haga clic en "Incluir" para crear uno nuevo.</li>
                </ul>
                </li>
                <li><p><strong>Incluir Dimensiones:</strong></p>
                <ul>
                  <li style="list-style-type: disc;">En planificación, haga clic en el ícono de inclusión para configurar las dimensiones.</li>
                  <li style="list-style-type: disc;">Seleccione el dataset correspondiente que contiene los datos que desea analizar.</li>
                  <li style="list-style-type: disc;">Seleccione el campo específico del dataset que desea que aparezca como dimensión en el registro de planificación (por ejemplo, "Nombre del usuario").</li>
                  
                  <li style="list-style-type: disc;">Incluya una descripción que se mostrará para esta dimensión en planificación.</li>
                  <li style="list-style-type: disc;">Repita esta acción para cada una de las dimensiones deseadas, respetando el límite de cinco dimensiones.</li>
                </ul></li>
                <li><p><strong>Incluir medidas:</strong></p>
                  <ul>
                  <li style="list-style-type: disc;">Haga clic en el ícono de + para incluir una nueva medida a su planificación.</li>
                  <li style="list-style-type: disc;">Defina escenarios prácticos para el registro de las medidas, como:</ul>
                    <ul>
                      <li style="list-style-type: circle;"><strong>Anual (mes por mes)</strong>: Para planificaciones con hasta un año de referencia.</li>
                      <li style="list-style-type: circle;">
                      <strong>Anual (por quarter)</strong>: Para planificaciones pensando en hasta dos años de referencia.</li>
                      <li style="list-style-type: circle;"><strong>Semanal (por trimestre)</strong>: Para planificaciones con un período de referencia.</li>
                      <li style="list-style-type: circle;"><strong>Quincenal (hasta por semestre)</strong>: Para planificaciones que no superan un semestre.</li>
                    </ul> 
                  </li>
                  <li>Asegúrese de que el total de medidas no supere 24.</li></ul></li><li><p><strong>Publicar la planificación:</strong></p><ul>
                    <li style="list-style-type: disc;">Después de incluir todas las dimensiones y medidas necesarias, haga clic en "Publicar" para activar la planificación.</li>
                    <li style="list-style-type: disc;"> La publicación aplica las configuraciones y permite que el registro de los datos se realice de acuerdo con las dimensiones y medidas definidas.</li></ul></li></ol>
              <br>

              <div class="alert alert-warning" role="alert" style="padding-left: 20px;">
                <i class="fas fa-info-circle"></i>
                <strong>Atención:</strong><br>
                El registro de datos en la planificación siempre se realiza en el último nivel de la dimensión seleccionada. Esto garantiza que la información se incluya y consolide correctamente, de acuerdo con la estructura definida. 
              </div>  
<br>  
            
<p>
  <video autoplay loop muted style="width: 100%; height: auto; max-width: 100%; display: block;">
    <source src="https://totvscrm.com/wp-content/uploads/2024/05/planejamento_1.mp4" type="video/mp4">
  </video>
</p><br>  
<div class="alert alert-warning" role="alert" style="padding-left: 20px;">
  <i class="fas fa-info-circle"></i>
  <strong>Atención:</strong><br>
  Este recurso de registro de planificación está disponible exclusivamente para clientes que adquirieron el módulo de Planificación del TOTVS CRM. Cabe destacar que este recurso no está disponible para el modelo TOTVS CRM BX. CertifíqueseAsegúrese de que su licencia incluye este módulo antes de intentar acceder o utilizar esta funcionalidad.

</div>  
        </section> 
         
        <section id="section4" style="margin-top: 40px;">
            <h2 class="custom-heading"><i class="fa-solid fa-signs-post"></i> &nbspEJEMPLO PRÁCTICO</h2>
                         
            <p>
                
                <br>
                
                <b>Desafío antiguo:</b>
                <p> 
                  Antes de los cambios, era posible incluir muchas dimensiones y medidas en los análisis, lo cual complicaba la interpretación de los datos y podía llevar a duplicidades.
                  
                  </p>
                
                <br>
                
                <b>Solución actualizada:</b>
                <p>Con los nuevos límites y controles de validación, los análisis son más claros y los datos son administrados de forma más eficaz, haciendo compatibles decisiones empresariales con informaciones precisas y bien organizadas.</p>
                
                <br>
                
                
                </p>
            </section> 
      
         
          </div>
          
            <!-- Tab 30 fim -->
          
            <!-- Tab 30 fim -->
          
          </div>
        </div>
    


    

    <div id="tab3" class="col s12">
      <div class="tab-content">
        <div style="background-color: #f4f5f7; padding: 20px; margin-left: 50px; margin-right: 50px;">
              <!-- Primeira coluna do conteúdo da guia 2 -->
              <div class="container">
                <h2 class="custom-heading"><i class="fa-solid fa-circle-question"></i> PERGUNTAS FREQUENTES</h2>
                <ul class="collapsible">
                  <li>
                    <div class="collapsible-header"><i class="material-icons">question_answer</i> Por que foram estabelecidos limites para dimensões e medidas?
                        </div>
                    <div class="collapsible-body"><span>Os limites foram estabelecidos para focar nas informações mais relevantes e impactantes, reduzindo a complexidade e aumentando a clareza das análises. 
                      </span></div>
                </li> 
                
                    <!-- Adicione mais perguntas e respostas aqui conforme necessário -->
                    <li>
                      <div class="collapsible-header"><i class="material-icons">question_answer</i> O que acontece se eu tentar adicionar mais de cinco dimensões ou 24 medidas?
                          </div>
                      <div class="collapsible-body"><span>O sistema não permitirá que mais de cinco dimensões ou 24 medidas sejam adicionadas. 
                        </span></div>
                  </li> 
                   
                </ul>
                
            </div>

            
                            <!-- Primeira coluna do conteúdo da guia 2 -->

            
            </div>
             
      </div>
  </div>

    
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<script>
  // Inicialização das tabs
  document.addEventListener("DOMContentLoaded", function () {
    var tabs = document.querySelectorAll(".tabs");
    M.Tabs.init(tabs);
  });
</script>

<script>
  const items = document.querySelectorAll("#indice li");

  items.forEach(item => {
      item.addEventListener('click', (e) => {
          const targetId = e.target.getAttribute('data-target');
          const targetElement = document.getElementById(targetId);
          window.scrollTo({
              top: targetElement.offsetTop - 10,
              behavior: "smooth"
          });
      });
  });
</script>

<script src="https://kit.fontawesome.com/c97d4c197a.js" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
 


<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/highlight.min.js"></script> 

<script>hljs.highlightAll();</script>
  


<script src="scripts.js"></script>

<script>
  document.addEventListener('DOMContentLoaded', function() {
      var elems = document.querySelectorAll('.collapsible');
      var instances = M.Collapsible.init(elems);
  });
</script>

 <!-- ... (conteudo video) ... -->
 <script src="https://www.youtube.com/iframe_api"></script>

 <script>
  var player;
  function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
      height: '315',
      width: '560',
      videoId: 'FvsuBOvyyro',
      playerVars: {
        start: 1238, // 20:38 em segundos
        end: 1356   // 22:36 em segundos
      }
    });
  }
</script>