HTML |
---|
<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"> <!-- Conteúdo do banner aqui --> </div> </div> </header> |
Livesearch | ||||||||
---|---|---|---|---|---|---|---|---|
|
HTML |
---|
<div class="FullWidthCarouselstyles__DraggableContainer-sc-16jty68-1 fwSgiY inherited-styles-for-exported-element"> <div class="grid__Container-sc-p40pqe-0 ctsbPE"> <div style="margin-left: -16px; cursor: grab; transition: margin-left 0.6s ease 0s;" class="grid__Row-sc-p40pqe-1 oFuOf"> <div class="grid__StyledColumn-sc-p40pqe-2 cJzWlo"><a data-testid="individual-template" data-uuid="2xIZne1VBy81MhQlXA90bn" draggable="false" href="https://tdn.totvs.com/display/TCGDC/Release" class="rogGT"> <div color="rgba(9, 30, 66, 1)" class="hNWOlT"></div> <div class="fzULwq"> <div class="bgvUWO"></div> <h3 class="titlegch3">Releases</h3> <p class="muted"> </p> <p>Clique e explore: cada versão do TOTVS CRM - Gestão de Clientes é apresentada com documentos detalhados, que fornecem insights claros sobre as mudanças implementadas, as melhorias realizadas e as novidades que foram introduzidas. </p> </div> </a></div> <!-- Separação bloco --> <div class="grid__StyledColumn-sc-p40pqe-2 cJzWlo"><a data-testid="individual-template" data-uuid="3Vmbzdd1S76GhVxNtDs2Kz" draggable="false" href="https://tdn.totvs.com/display/TCGDC/Roadmap+do+Produto" class="rogGT"> <div color="rgba(9, 30, 66, 1)" class="grqWLk"></div> <div class="fzULwq"> <div class="eUOZOn"></div> <h3 class="titlegch3">Roadmap</h3> <p class="muted"> </p> <p>Acompanhe nosso roadmap e prepare-se para as próximas inovações que irão elevar sua experiência com o TOTVS CRM - Gestão de Clientes a um novo patamar. Estamos ansiosos para crescer e evoluir junto com você!</p> </div> </a></div> <div class="cJzWlo"><a data-testid="individual-template" data-uuid="1Tqt54zuPmOckSi6MKDPiy" draggable="false" href="https://tdn.totvs.com/pages/viewpage.action?pageId=636959623" class="rogGT"> <div color="rgba(9, 30, 66, 1)" class="cELStS"></div> <div class="fzULwq"> <div class="gRxMAA"></div> <h3 class="titlegch3">Calendário</h3> <p>Fique de olho no Calendário de Atualizações e antecipe-se às novidades que farão a diferença no seu dia a dia. Estamos comprometidos em mantê-lo atualizado com as mais recentes inovações do TOTVS CRM - Gestão de Clientes.</p> </div> </a></div> <!-- Separação bloco --> </div> </div> </div> <style> *, ::after, ::before { box-sizing: border-box; } .wiki-content h3 { margin: 0 !important; } .inherited-styles-for-exported-element { color: #091e42; font-family: "Roboto", sans-serif; font-size: 1.25rem; font-weight: 400; line-height: 1.5; } .titlegch3 { font-family: "Roboto", sans-serif; font-size: 1.25rem; font-weight: 500; line-height: 1.2; margin-bottom: .5rem; margin-top: 0; } @media (min-width: 768px) { .titlegch3 { font-size: 1.5rem; line-height: 1.33333; } } .ctsbPE { margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; width: 100%; } @media (min-width: 576px) { .ctsbPE { max-width: 540px; } } @media (min-width: 768px) { .ctsbPE { max-width: 720px; } } @media (min-width: 992px) { .ctsbPE { max-width: 960px; } } @media (min-width: 1200px) { .ctsbPE { max-width: 1140px; } } .oFuOf { -webkit-box-align: stretch; -webkit-box-pack: start; align-items: stretch; display: flex; flex-wrap: wrap; justify-content: space-around; margin-left: -1rem; margin-right: -1rem; } .cJzWlo { display: block; flex: 1 1 auto; padding: 1rem; position: relative; scroll-margin-top: 72px; text-align: center; width: 83.3333%; margin: 10px; max-width: 300px; } @media (min-width: 992px) { .cJzWlo { display: block; flex: 0 0 auto; width: 33.3333%; } } .fwSgiY { overflow-x: hidden; } .rogGT { border-radius: .5rem; box-shadow: rgba(9, 30, 66, .15) 0 .5rem 1rem 0; color: inherit !important; display: block; height: 100%; margin: 0; overflow: hidden; text-align: left; text-decoration: none !important; text-wrap: wrap; user-select: none; white-space-collapse: collapse; width: auto; } .hNWOlT { background-color: #6B48FF; height: 2rem; } @media (min-width: 576px) { .hNWOlT { height: 3rem; } } .grqWLk { background-color: #0ADBE3; height: 2rem; } @media (min-width: 576px) { .grqWLk { height: 3rem; } } .cELStS { background-color: #FEAC0E; height: 2rem; } @media (min-width: 576px) { .cELStS { height: 3rem; } } .bxLzQJ { background-color: #ffc400; height: 2rem; } @media (min-width: 576px) { .bxLzQJ { height: 3rem; } } .lnQKVZ { background-color: #00c7e5; height: 2rem; } @media (min-width: 576px) { .lnQKVZ { height: 3rem; } } .kgNiiW { background-color: #f99cdb; height: 2rem; } @media (min-width: 576px) { .kgNiiW { height: 3rem; } } .bgvUWO, .eUOZOn, .gAonen, .gRxMAA, .iRWtjz, .kIYtDi { background-color: #fff; background-image: url(https://totvscrm.com/wp-content/uploads/2024/01/pre-release-access-1.png); background-position: center center; background-repeat: no-repeat; background-size: contain; border: 8px solid #fff; border-radius: .5rem; height: 3rem; left: 1rem; position: absolute; top: -1.5rem; width: 3rem; } .eUOZOn, .gAonen, .gRxMAA, .iRWtjz, .kIYtDi { background-image: url(https://totvscrm.com/wp-content/uploads/2024/01/roadmap-3.png); } .gAonen, .gRxMAA, .iRWtjz, .kIYtDi { background-image: url(https://totvscrm.com/wp-content/uploads/2024/01/calend.png); } .gAonen, .iRWtjz, .kIYtDi { background-image: url(https://images.ctfassets.net/rz1oowkt5gyp/4Mgm4SG6P6bD673rMtNpXP/9f8798510480b30d296550be747b9624/icon-content-checklists_2x.png); } .gAonen, .kIYtDi { background-image: url(https://images.ctfassets.net/rz1oowkt5gyp/x2AI5JZPTDVY7BxKbvClM/dc65b20bf0914caa72bcaf2ddbb05d9b/UseCasesBrainstorming.svg); } .gAonen { background-image: url(https://images.ctfassets.net/rz1oowkt5gyp/5rv4eidOfMf1vdEzVpHNlA/bb102f380f9cfd3d1761858d8910963d/icon-object-book_2x.png); } .fzULwq { padding: 2.25rem 1.5rem 1.5rem; position: relative; } body :focus { outline: 2px solid #091e42; } a:not([href]), a:not([href]):hover { color: inherit; } .fzULwq p { font-size: 13px; margin: 0; } .fzULwq p+p { margin-top: .5rem; } .cJzWlo>:last-child, .cJzWlo>:last-child>:last-child, .cJzWlo>:last-child>:last-child>:last-child { margin-bottom: 0; } .fwSgiY .grid__Row-sc-p40pqe-1 { flex-wrap: nowrap; padding-bottom: 1rem; width: calc(100% + 2rem); } .rogGT:focus, .rogGT:hover { box-shadow: rgba(9, 30, 66, .25) 0 .5rem 1rem 0; color: inherit !important; text-decoration: none !important; } .fzULwq p.muted { color: #5e6c84; } body :focus:not(:focus-visible) { outline: 0 !important; } </style> |
HTML |
---|
<div class="lumen-container integrations__header-content lumen-container--flex lumen-container--inner lumen-container--flex-column lumen-container--flex-align-center inherited-styles-for-exported-element"> <p class="lumen-chip integrations__chip lumen-chip--default">Aprofunde Seu Conhecimento</p> <br> <p class="lumen-headline">Explore a Documentação do TOTVS CRM</p> <p class="lumen-body-text integrations__subtitle lumen-body-text--default lumen-body-text--medium-emphasis lumen-body-text--lg">Este recurso valioso é projetado para enriquecer sua compreensão do produto e otimizar sua experiência de uso.</p> </div> <style> body { background: #eee; /* This is just a helper in case the element has a transparent background or white colors. */ } .inherited-styles-for-exported-element { color: #333; font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-size: 16px; font-weight: 400; line-height: 1.5; } *, ::after, ::before { border: 0 solid #e8f2fa; } *, ::after, ::before { box-sizing: border-box; } svg { display: block; vertical-align: middle; } .lumen-chip { align-items: center; background: #e5efff; background-repeat: repeat; border-radius: 1e+10px; column-gap: 8px; display: inline-flex; font-family: Inter; font-size: 14px; font-weight: 500; justify-content: center; padding: 4px 12px; row-gap: 8px; width: fit-content; } .lumen-chip--default { color: #003793; } .lumen-headline { font-family: "Roboto"; font-weight: 500; font-size: 32px; margin: 0; } .lumen-headline--headline-4 { font-size: 48px; } .lumen-headline--high-emphasis { color: #101820; } .lumen-button, .lumen-button--svg-container { align-items: center; display: flex; justify-content: center; transition: all .3s; transition-behavior: normal; } .lumen-button { border-radius: 9000px; border-style: none; font-family: Inter; text-decoration: none; text-wrap: nowrap; white-space-collapse: collapse; } .lumen-button--svg-container { border-radius: 50%; } .lumen-button--sm { column-gap: 8px; font-size: 14px; font-weight: 500; line-height: 24px; max-height: 32px; row-gap: 8px; } [role=button] { cursor: pointer; } .lumen-button--svg-container svg { fill: #fff; } .lumen-chip:focus-visible, .lumen-headline:focus-visible { outline: 1px dashed; } .lumen-container { width: 100%; } .lumen-button--link, .lumen-button--link:active, .lumen-button--link:hover { background-color: transparent; color: #101820; } .lumen-button--link:focus { background-color: transparent; color: #101820; } .lumen-button--sm .lumen-button--svg-container, .lumen-button--sm .lumen-button--svg-container svg { height: 24px; width: 24px; } .lumen-chip:empty::before, .lumen-container .lumen-body-text:empty::before, .lumen-headline:empty::before { content: attr(data-placeholder); } a:not([href]):not([tabindex]), a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover { color: inherit; text-decoration: none; } .lumen-container.lumen-container--flex { display: flex; } .lumen-container.lumen-container--flex-column { flex-direction: column; } .lumen-container.lumen-container--flex-align-center { align-items: center; } @media screen and (max-width: 767px) { .lumen-container:not(.lumen-container--inner) { max-width: 100%; padding-inline-end: 16px; padding-inline-start: 16px; } } @media screen and (min-width: 768px) and (max-width: 1023px) { .lumen-container:not(.lumen-container--inner) { max-width: 688px; } } @media screen and (min-width: 1024px) and (max-width: 1279px) { .lumen-container:not(.lumen-container--inner) { max-width: 928px; } } @media screen and (min-width: 1280px) and (max-width: 1439px) { .lumen-container:not(.lumen-container--inner) { max-width: 1120px; } } @media screen and (min-width: 1440px) and (max-width: 1919px) { .lumen-container:not(.lumen-container--inner) { max-width: 1208px; } } @media screen and (min-width: 1920px) { .lumen-container:not(.lumen-container--inner) { max-width: 1392px; } } .lumen-container .lumen-body-text { font-family: Inter; font-weight: 400; line-height: 150%; margin: 0; } .lumen-container .lumen-body-text--lg { font-size: 20px; } .lumen-container .lumen-body-text--medium-emphasis { color: #4b5863; } .lumen-button--link:hover .lumen-button--svg-container { transform: translateX(4px); } .lumen-button--link:focus .lumen-button--svg-container { background-color: #003793; } a:not([href]):not([tabindex]):focus { outline: 0; } .lumen-container .integrations__subtitle, .lumen-container .integrations__title { text-align: center; } @media screen and (max-width: 767px) { .lumen-container .integrations__title { font-size: 32px; } } @media screen and (min-width: 768px) and (max-width: 1023px) { .lumen-container .integrations__title { font-size: 32px; } } @media screen and (min-width: 1024px) and (max-width: 1279px) { .lumen-container .integrations__title { font-size: 32px; } } @media screen and (min-width: 768px) and (max-width: 1023px) { .lumen-container .integrations__subtitle { padding-inline-end: 12px; padding-inline-start: 12px; } } @media screen and (max-width: 767px) { .lumen-container .integrations__subtitle, .lumen-container .integrations__title { padding-inline-end: 32px; padding-inline-start: 32px; } } .lumen-container .lumen-body-text:focus-visible { outline: 1px dashed; } .lumen-chip { line-height: 150% !important; margin-left: 0 !important; margin-right: 0 !important; margin-top: 0 !important; } .lumen-headline { line-height: 120% !important; } .lumen-button--link { padding: 0 !important; } a:active { outline: 0 !important; } .lumen-button--link:focus { outline: 1px solid transparent !important; } .lumen-button--link .lumen-button--svg-container { margin-right: 0 !important; } .lumen-container .integrations__chip { margin-bottom: 8px !important; } </style> |
HTML |
---|
<div class="test-app apps-center inherited-styles-for-exported-element"> <div class="apps-wrapper"> <div class="apps"> <div class="item appconnect-item "> <div class="integration-logo" style="background-color:#FFFFFF;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/1+-+Administrativo" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/file-document-outline-12.svg');" aria-label="adm"></a> </div> <h4>Administrativo</h4> </div> <div class="item appconnect-item "> <div class="integration-logo" style="background-color:#FFFFFF;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/2+-+Agenda" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/calendar-today-1.svg');" aria-label="agenda"></a> </div> <h4>Agenda</h4> </div> <div class="item appconnect-item "> <div class="integration-logo" style="background-color:#FFFFFF;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/3+-+Analytics" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/chart-areaspline-1.svg');" aria-label="Analytics"></a> </div> <h4>Analytics</h4> </div> </div> </div> <div class="apps-wrapper"> <div class="apps"> <div class="item appconnect-item "> <div class="integration-logo" style="background-color:#FFFFFF;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/4+-+Analytics+Studio" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/chart-timeline-variant-shimmer-1.svg');" aria-label="Analytics Studio"></a> </div> <h4>Analytics Studio</h4> </div> <div class="item appconnect-item "> <div class="integration-logo" style="background-color:#ffffff;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/5+-+Atividade" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/clipboard-text-outline-1.svg');" aria-label="Atividades"></a> </div> <h4>Atividades</h4> </div> <div class="item appconnect-item "> <div class="integration-logo" style="background-color:#FFFFFF;"> <a class="integration-image" href="https://tdn.totvs.com/pages/viewpage.action?pageId=728643168" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/cube-outline-1.svg');" aria-label="Catálogo"></a> </div> <h4>Catálogo</h4> </div> </div> </div> <div class="apps-wrapper"> <div class="apps"> <div class="item appconnect-item "> <div class="integration-logo" style="background-color:#FFFFFF;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/7+-+Contas" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/account-multiple-plus-outline-1.svg');" aria-label="Contas"></a> </div> <h4>Contas</h4> </div> <div class="item appconnect-item "> <div class="integration-logo" style="background-color:#ffffff;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/8+-+Data+Discovery" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/lightbulb-on-10-1.svg');" aria-label="Data discovery"></a> </div> <h4>Data discovery</h4> </div> <div class="item appconnect-item "> <div class="integration-logo" style="background-color:#ffffff;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/9+-+Documentos" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/file-replace-outline-1.svg');" aria-label="Documentos"></a> </div> <h4>Documentos</h4> </div> </div> </div> <div class="apps-wrapper"> <div class="apps"> <div class="item appconnect-item"> <div class="integration-logo" style="background-color:#ffffff;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/10+-+Marketing" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/bullhorn-outline-1.svg');" aria-label="Marketing"></a> </div> <h4>Marketing</h4> </div> <div class="item appconnect-item"> <div class="integration-logo" style="background-color:#ffffff;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/11+-+Marketplace" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/arrow-decision-outline-1.svg');" aria-label="Marketplace"></a> </div> <h4>Marketplace</h4> </div> <div class="item appconnect-item "> <div class="integration-logo" style="background-color:#ffffff;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/12+-+Oportunidades" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/trophy-outline-1.svg');" aria-label="Oportunidades"></a> </div> <h4>Oportunidades</h4> </div> </div> </div> <div class="apps-wrapper"> <div class="apps"> <div class="item appconnect-item"> <div class="integration-logo" style="background-color:#FFFFFF;"> <a class="integration-image" href="https://tdn.totvs.com/pages/viewpage.action?pageId=821575034" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/puzzle-outlineoutlinee.svg');" aria-label="Personalização"></a> </div> <h4>Personalização</h4> </div> <div class="item appconnect-item"> <div class="integration-logo" style="background-color:#FFFFFF;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/14+-+Planejamento" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/bullseye-arrow-1.svg');" aria-label="Planejamento"></a> </div> <h4>Planejamento</h4> </div> <div class="item appconnect-item "> <div class="integration-logo" style="background-color:#FFFFFF;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/15+-+Vendas" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/tag-outline-1.svg');" aria-label="Vendas"></a> </div> <h4>Vendas</h4> </div> </div> </div> <div class="apps-wrapper"> <div class="apps"> <div class="item appconnect-item "> <div class="integration-logo" style="background-color:#ffffff;"> <a class="integration-image" href="https://tdn.totvs.com/display/TCGDC/17+-+Workflow" style="background-image: url('https://totvscrm.com/wp-content/uploads/2024/01/format-text-wrapping-overflow-1.svg');" aria-label="Workflow"></a> </div> <h4>Workflow</h4> </div> </div> </div> </div> <style> * { -webkit-font-smoothing: antialiased; box-sizing: border-box; } .inherited-styles-for-exported-element { color: #312a44; font-family: Roboto, sans-serif; font-size: 15px; font-weight: 400; line-height: 1.4; } a { text-decoration: none; } p { margin: 0; } h4, p { padding: 0; } .test-app { justify-content: space-around; } @media screen and (max-width: 840px) { .apps-wrapper { margin-bottom: 30px; } } .test-app { display: flex; } .integration-logo { align-items: center; display: flex; filter: drop-shadow(rgba(0, 0, 0, .15) 0 3px 3px); height: 70px; justify-content: center; padding: 12px; width: 70px; } .integration-image { background-position: center center; background-repeat: no-repeat; background-size: contain; padding-top: 100%; width: 100%; } .apps { display: flex; flex-direction: column; margin-bottom: 15px; } @media screen and (max-width: 840px) { .apps { border-bottom-color: initial; border-bottom-style: none; border-bottom-width: initial; border-left-color: initial; border-left-style: none; border-left-width: initial; border-top-color: initial; border-top-style: none; border-top-width: initial; flex-direction: row; justify-content: center; } } :active, :focus { outline: 0; } .apps-wrapper p, .item.appconnect-item h4 { color: #343741; letter-spacing: -.005em; text-align: center; } .apps-wrapper p { font-family: Roboto, helvetica, arial, sans-serif; font-size: 18px !important; font-weight: 700 !important; line-height: 32px; } .test-app.apps-center { width: 100%; } .item.appconnect-item { align-items: center; background-attachment: unset; background-clip: unset; background-color: unset; background-image: unset; background-origin: unset; background-position: unset unset; background-repeat: unset; background-size: unset; border-radius: unset; border-style: initial; border-width: 0; display: flex; filter: drop-shadow(transparent 0 0 0); flex-direction: column; justify-content: flex-start; margin: 12px 16px; } @media screen and (max-width: 840px) { .test-app.apps-center { display: flex; flex-direction: column; } } .item.appconnect-item h4 { font-family: Roboto; font-size: 14px; font-weight: 500; line-height: normal; margin: 0 0 42px; } .apps .item:hover { filter: drop-shadow(rgba(16, 130, 145, .25) 0 4px 22px) !important; margin-bottom: 18px; margin-top: 6px; transition: all .3s ease-out; transition-behavior: normal; } .apps { border-right-color: initial !important; border-right-style: initial !important; border-right-width: 0 !important; } .integration-logo { border-radius: 22px !important; margin-bottom: 14px !important; } .test-app.apps-center { margin: 30px auto 0 !important; max-width: 1070px !important; } .item.appconnect-item { height: auto !important; max-width: 100% !important; width: auto !important; } </style> |