Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

HTML
<div id="myCarousel" style="max-width: 100%; overflow: hidden;">
  <div style="display: flex; transition: all 1s ease;">

    <div style="flex: 0 0 100%; max-width: 100%; text-align: center;">
      <img src="https://a.imagem.app/oX6ZGZ.jpeg" alt="Imagem 1" style="max-width: 100%;">
    </div>

    <div style="flex: 0 0 100%; max-width: 100%; text-align: center;">
      <img src="https://a.imagem.app/oTjEXS.jpeg" alt="Imagem 2" style="max-width: 100%;">
    </div>

     <div style="flex: 0 0 100%; max-width: 100%; text-align: center;">
      <img src="https://a.imagem.app/oX6ZGZ.jpeg" alt="Imagem 3" style="max-width: 100%;">
    </div>    </div>
</div>  


<style>
  #myCarousel {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
  }

  #myCarousel > div {
    display: flex;
    animation: carousel-animation 15s infinite; /* Alterado para 3s */
  }

  #myCarousel > div > div {
    flex: 0 0 100%;
    max-width: 100%;
    text-align: center;
  }

  @keyframes carousel-animation {
    0% {
      transform: translateX(0);
    }
    33.33% {
      transform: translateX(-100%);
    }
    66.66% {
      transform: translateX(-200%);
    }
    100% {
      transform: translateX(0);
    }
  }
</style>  


Informações

A participação em nosso evento de Workshop pode ser solicitada através do e-mail: [email protected].


HTML
<style type="text/css">
    .cards-container {
        width: 100%;
        height: auto;
        margin: auto;
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        justify-items: center;
    }

    .card {
        width: 100%;
        height: auto;
        display: flex;
        margin: auto auto 20px auto;
        box-shadow: 0px 2px 4px #00000029;
        border-radius: 10px;
    }

    .card-image {
        object-fit: cover;
        width: 43%;
        max-width: 420px;

        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
    }

    .card-text-container {
        text-align: left;
        padding: 30px;
    }

    .card-label {
        color: orange;
        font-weight: bold;
        font-size: 13px;
    }

    #card-title-link {
        text-decoration: none;
        color: #045B8F;
        font-weight: bold;
        font-size: 17px;
    }

    #card-title-link:hover {
        text-decoration: underline;
    }

    .card-desc {
        margin: 0 !important;
        font-size: 15px;
        font-weight: 400;
        letter-spacing: 0px;
        color: #494440;
    }

    .card-text-margin-bottom {
        margin: 0 0 5px 0 !important;
    }
</style><section class="cards-container">
<div class="card">
<div class="card-text-container">
<h3 style="color: rgb(203, 25, 89); font-weight: bold; text-align: center;">Informações</h3>
<p class="card-desc" style="font-family: 'Roboto',  justify-content: space-between;">Entre em contato pelo E-mail <a
href="https://totvscst.zendesk.com/hc/pt-br/#home" target="_blank">[email protected]</a>. A
equipe de atendimento do TOTVS Fluig estará pronta para lhe ajudar.</p>
<p style="font-family: 'Roboto',  justify-content: space-between;">Nosso Workshop tem como objetivo proporcionar uma imersão completa
nas soluções da TOTVS Fluig. Esteja preparado para adquirir um profundo conhecimento de nossa plataforma e
descobrir as melhores abordagens para implementá-la em sua empresa. Abordaremos todos os aspectos da plataforma,
com uma visão detalhada que inclui as atualizações mais recentes. O evento contará com a participação de nossos
especialistas de diversas áreas para garantir a abordagem abrangente de todos os temas, proporcionando uma visão
completa do TOTVS Fluig. Além disso, ofereceremos treinamento ministrado pelos especialistas do Fluig Academy.
Segue cronograma abaixo:</p>

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




Workshop Fluig: Sua Jornada Personalizada para o Sucesso!

HTML
<div class="container-fluid">
  <div class="row">
    <div class="col-12 col-lg-3" style="width: 100%; height: 100%; background-color: #f9f9f9; border-right: 1px solid #007BFF;">
      <!-- Conteúdo do mural lateral aqui -->
      <div style="margin: 20px; text-align: center;">
        <div style="font-weight: bold; color: #007BFF;">Cronograma</div>
      </div>
      <div style="margin: 20px; text-align: left;">
        <div style="font-weight: bold; color: #007BFF;">08h30 - Abertura</div>
      </div>
      <div style="margin: 20px; text-align: left;">
        <div style="font-weight: bold; color: #007BFF;">09h20 - Time Fluig</div>
        <div style="margin-left: 20px;">
          <p>Suporte, Customer Success e Produto</p>
        </div>
      </div>
      <div style="margin: 20px; text-align: left;">
        <div style="font-weight: bold; color: #007BFF;">09h40 - Treinamento</div>
        <div style="margin-left: 20px;">
          <div>
            <ul>
              <li>Modelos de Ambiente
                <ul>
                  <li>On Premise, Cloud TOTVS ou Cloud Terceiro</li>
                </ul>
              </li>
              <!-- Outros itens do cronograma -->
            </ul>
          </div>
        </div>
      </div>
      <div style="margin: 20px; text-align: left;">
        <div style="font-weight: bold; color: #007BFF;">10:40 - Intervalo</div>
      </div>
      <div style="margin: 20px; text-align: left;">
        <div style="font-weight: bold; color: #007BFF;">10:50 - Processos</div>
        <div style="margin-left: 20px;">
          <p>Automatização de processos, Notação BPMN, Apresentação de processo pronto e integrado para demonstrar e explicar</p>
        </div>
        <div>
          <ul>
            <li>Fluig
              <ul>
                <li>O Fluig é customizável, Integrações (caminhos)</li>
              </ul>
            </li>
            <!-- Outros itens do cronograma -->
          </ul>
        </div>
      </div>
      <div style="margin: 20px; text-align: left;">
        <div style="font-weight: bold; color: #007BFF;">11:45 - Conclusão e Perguntas</div>
      </div>
      <div style="margin: 20px; text-align: left;">
        <div style="font-weight: bold; color: #007BFF;">12:00 - Fim</div>
      </div>
    </div>


HTML
<style type="text/css">
    .cards-container {
        width: 100%;
        height: auto;
        margin: auto;
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        justify-items: center;
    }

    .card {
        width: 100%;
        height: auto;
        display: flex;
        margin: auto auto 20px auto;
        box-shadow: 0px 2px 4px #00000029;
        border-radius: 10px;
    }

    .card-image {
        object-fit: cover;
        width: 43%;
        max-width: 420px;

        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
    }

    .card-text-container {
        text-align: left;
        padding: 30px;
    }

    .card-label {
        color: orange;
        font-weight: bold;
        font-size: 13px;
    }

    #card-title-link {
        text-decoration: none;
        color: #CB1959;
        font-weight: bold;
        font-size: 17px;
    }

    #card-title-link:hover {
        text-decoration: underline;
    }

    .card-desc {
        margin: 0 !important;
        font-size: 15px;
        font-weight: 400;
        letter-spacing: 0px;
        color: #494440;
    }

    .card-text-margin-bottom {
        margin: 0 0 5px 0 !important;
    }
</style>

<section class="cards-container">
    <div class="card">
        <img 
            class="card-image" 
            src="https://tdn.totvs.com/download/attachments/66618185/banner_512x258.png?" 
            alt=""
        >
        <div class="card-text-container">
            <p class="card-label card-text-margin-bottom">TOTVS Fluig Plataforma</p>
            <h2 id="card-title" class="card-text-margin-bottom">
                <a href="https://tdn.totvs.com/pages/releaseview.action?pageId=95617506" id="card-title-link">
                    Fique por dentro da Novidades!
                </a>
            </h2>
            <p class="card-desc">Fique por dentro de todas as novidades da última grande atualização do TOTVS Fluig Plataforma para agregar valor ao seu negócio.
            </p>
        </div>
    </div>

    <div class="card">
        <img 
            class="card-image" 
            src="https://a.imagem.app/oFM2xT.png"
            alt=""
        >
        <div class="card-text-container">
            <p class="card-label card-text-margin-bottom">FLOWS</p>
            <h2 id="card-title" class="card-text-margin-bottom">
                <a href="https://tdn.totvs.com/display/fluig/TOTVS+FLOWS" id="card-title-link">TOTVS Flows: Processos prontos para impulsionar sua empresa.</a>
            </h2>
            <p class="card-desc">O TOTVS Flows é uma solução de processos pré-definidos e configurados pelo time TOTVS Fluig que estão prontos para uso. Ele pode atender a diversos segmentos, tais como tecnologia da informação, suprimentos, financeiro, recursos humanos, dentre outros.</p>
        </div>
    </div>

    <div class="card">
        <img 
            class="card-image" 
            src="https://tdn.totvs.com/download/attachments/66618185/social.jpg"
            alt=""
        >
        <div class="card-text-container">
            <p class="card-label card-text-margin-bottom">TOTVS Identity</p>
            <h2 id="card-title" class="card-text-margin-bottom">
                <a href="https://tdn.totvs.com/pages/viewpage.action?pageId=269063445#Identity|Produ%C3%A7%C3%A3o-Junho" id="card-title-link">Novas opções de provisionamento e autenticação</a>
            </h2>
            <p class="card-desc">Agora você pode permitir o login com redes sociais (Linkedin, Google, Facebook, etc) para os usuários de sua empresa. Aproveite e confira também a nova tela de Segurança, muito mais organizada e fácil de usar.</p>
        </div>
    </div>
</section>
Informações
iconfalse
titleLinks Úteis



HTML
<div style="display: flex; flex-wrap: wrap; justify-content: space-between;">
    <div style="width: 23%; max-width: 400px; padding: 10px; border: 1px solid #ccc; border-radius: 5px; text-align: center; background-color: #f9f9f9; display: flex; flex-direction: column; margin-bottom: 10px;">
        <h3>TOTVS Store</h3>
        <div style="flex-grow: 1;">
            <p>Conheça a TOTVS STORE: a loja virtual da maior empresa de tecnologia do Brasil. Acesse e confira nossos produtos e serviços.</p>
        </div>
        <a href="https://totvs.store/" style="display: block; background-color: #007BFF; color: #fff; padding: 10px; text-align: center; text-decoration: none; border-radius: 5px; margin-top: 10px;">Acesse</a>
    </div>

    <div style="width: 23%; max-width: 400px; padding: 10px; border: 1px solid #ccc; border-radius: 5px; text-align: center; background-color: #f9f9f9; display: flex; flex-direction: column; margin-bottom: 10px;">
        <h3>Fluig Academy</h3>
        <div style="flex-grow: 1;">
            <p>Aprenda programação, integrações com ERP, instalação de sistema, KPIs e muito mais no portal oficial de treinamentos do TOTVS Fluig.</p>
        </div>
        <a href="https://academy.fluig.com/" style="display: block; background-color: #007BFF; color: #fff; padding: 10px; text-align: center; text-decoration: none; border-radius: 5px; margin-top: 10px;">Acesse</a>
    </div>

    <div style="width: 23%; max-width: 400px; padding: 10px; border: 1px solid #ccc; border-radius: 5px; text-align: center; background-color: #f9f9f9; display: flex; flex-direction: column; margin-bottom: 10px;">
        <h3>TOTVS Fluig Developer</h3>
        <div style="flex-grow: 1;">
            <p>APIs, documentações técnicas, Style Guide.</p>
        </div>
        <a href="https://style.fluig.com/" style="display: block; background-color: #007BFF; color: #fff; padding: 10px; text-align: center; text-decoration: none; border-radius: 5px; margin-top: 10px;">Acesse</a>
    </div>

    <div style="width: 23%; max-width: 400px; padding: 10px; border: 1px solid #ccc; border-radius: 5px; text-align: center; background-color: #f9f9f9; display: flex; flex-direction: column; margin-bottom: 10px;">
        <h3>Área do Cliente</h3>
        <div style="flex-grow: 1;">
            <p>Abertura de tickets, Download de Atualizações, Notícias</p>
        </div>
        <a href="http://suporte.fluig.com/" style="display: block; background-color: #007BFF; color: #fff; padding: 10px; text-align; text-decoration: none; border-radius: 5px; margin-top: 10px;">Acesse</a>
    </div>
</div>

<style>
@media (max-width: 986px) {
    div[style*="width: 23%"] {
        width: calc(50% - 10px);
    }
}

@media (max-width: 500px) {
    div[style*="width: 23%"] {
        width: 100%;
    }
    div[style*="flex-direction: column"] {
        flex-direction: row;
    }
}
</style>








HTML
<div style="text-align: center;>
<h1 style="text-align: center;" id="Plataforma|Oquehádenovo?-AtualizaçãoSilverMist(1.8.1)"><span style="color: rgb(23,43,77);"><strong><a href="https://tdn.totvs.com/x/hCFzL" rel="nofollow">Atualização Silver Mist (1.8.1)</a></strong></span></h1><p></p>
<iframe width="800" height="450" src="https://www.youtube.com/embed/UrBKSOalubI" title="Novidades TOTVS Fluig 1.8.1 | Silver Mist" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe></div>




HTML
<style type="text/css">
    .cards-container {
        width: 100%;
        height: auto;
        margin: auto;
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        justify-items: center;
    }

    .card {
        width: 100%;
        height: auto;
        display: flex;
        margin: auto auto 20px auto;
        box-shadow: 0px 2px 4px #00000029;
        border-radius: 10px;
    }

    .card-image {
        object-fit: cover;
        width: 43%;
        max-width: 420px;

        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
    }

    .card-text-container {
        text-align: left;
        padding: 30px;
    }

    .card-label {
        color: orange;
        font-weight: bold;
        font-size: 13px;
    }

    #card-title-link {
        text-decoration: none;
        color: #CB1959;
        font-weight: bold;
        font-size: 17px;
    }

    #card-title-link:hover {
        text-decoration: underline;
    }

    .card-desc {
        margin: 0 !important;
        font-size: 15px;
        font-weight: 400;
        letter-spacing: 0px;
        color: #494440;
    }

    .card-text-margin-bottom {
        margin: 0 0 5px 0 !important;
    }
</style>

<section class="cards-container">
    <div class="card">
        
        <div class="card-text-container">
            <p class="card-label card-text-margin-bottom">Suporte</p>
            <h2 id="card-title" class="card-text-margin-bottom">
                <a href="https://suporte.totvs.com/portal/p/10098/suporte-fluig-home" id="card-title-link" target="blank">Precisa de ajuda e não encontrou por aqui?</a>
            </h2>
            <p class="card-desc">Entre em contato pelo <a href="https://suporte.totvs.com/portal/p/10098/suporte-fluig-home" target="blank">Portal de clientes</a> ou por nosso canal telefônico <b>(11) 3003 5559</b>. A equipe de atendimento do TOTVS Fluig estará pronta para lhe ajudar.</p>
        </div>
    </div>
</section>