Histórico da Página
| HTML |
|---|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<div class="top">
<div class="header">
<center> <img class="img" src="https://tdn.totvs.com/download/attachments/732664978/log.png?version=1&modificationDate=1673393212156&api=v2" alt=""> </center>
</div>
</div>
<div class="content">
<div class="date"> <br>
<div>JAN<<div>ENE</div>
<div class="day">6</div>
</div>
<div class="article"> <br>
<h1> ✒️ RegrasReglas comcon multiníveismultiniveles de ocultaçãoocultación y eedición ediçãocondicionales condicionaisen nala telapantalla de Atividades<Actividades</h1>
<br>
<span class="badge badge-melhoria">MELHORIA<>MEJORA</span>
<br> <br>
<table>
<colgroup>
<col span="2" class="day">
<col>
<col>
<col>
<col>
<col>
<col>
<col>
</colgroup>
<thead>
<tr>
<th scope="row">Produto<>Producto</th>
<td>TOTVS CRM GestãoGestión de Clientes<clientes</td>
</tr>
<tr>
<th scope="row">Módulo</th>
<td>Personalização<td>Personalización </td>
</tr>
<tr>
<th scope="row">Ambiente<>Entorno</th>
<td>Funcionalidades </td>
</tr>
<tr>
<th scope="row">Identificador</th>
<td>ME260520220839b </td>
</tr>
<tr>
<th scope="row">Ticket/Issue</th>
<td>DTCRMSD-1104 </td>
</tr>
<tr>
</table>
<br>
<p> AsLos equipesequipos de vendasventas estãosiempre sempreestán sobrecarregadassobrecargados comcon oel número de atividadesactividades que precisamnecesitan fazerhacer. OEl problema ées que, àsa vezesveces, acabamacaban preenchendocompletando campos que nãono sãoson relevantes para suassus atividadesactividades ouy esquecendose olvidan de preenchercompletar campos importantes. TudoTodo issoesto acaba causandoocasionando maismás trabalhotrabajo para ael equipeequipo de vendasventas, que jáya temtiene muitomucho opara que fazerhacer. Pensando nissoen esto, agoraahora ées possívelposible condicionar ala exibiçãoexhibición ey ediçãoedición de atividadesactividades a partir de regrasreglas. Este documento olo guiará por peloel processoproceso de uso dade melhoriamejora. </p>
<div class="pause" id="i">📍 Onde>📍 ¿Dónde podepuede ser encontradoencontrarse?</div>
<p>
<ol>
<li> Módulo PersonalizaçãoPersonalización </li>
<li> Funcionalidades </li>
<li> Activities </li>
<li> Card formulário </li>
</ol>
</p>
<div class="pause">🔍 O¿Qué que mudoucambió?</a></div>
<p> Disponibilizamos uma seção no Hemos puesto a disposición una sección en el recurso de funcionalidades para que sejasea possívelposible cadastrarregistrar, editar ey removereliminar regrasreglas de exibiçãoexhibición ey/ouo ediçãoedición condicionadas a umauna expressãoexpresión de validaçãovalidación. As Las açõesacciones possíveisposibles para modificación de alteraçãolos dosestatus estadosde doslos elementos quandocuando ala regraregla condicional forsea atendida sãoson: <br> <br>
<strong> Ocultar - </strong> Oculta Faz com que o el elemento sejaen ocultadoel no formulárioformulario <br><br>
<strong> VisívelVisible - </strong> OEl elemento selecionadoseleccionado será visívelvisible en noel formulárioformulario <br><br>
<strong>Tornar<strong>Dejar editáveleditable - </strong> OEl elemento poderápodrá sereditarse editadoen empantalla tela <br><br>
<strong>Tornar<strong>Dejar somentesolamente leituralectura - </strong> Determina Faz com que oel elemento não possa ser editado, ou seja, permitirá somente leitura da informação presente no atributo. <br><br>
Exemplo de uma ocultação àno pueda editarse, es decir, solo se permitirá la lectura de la información presente en el atributo.<br><br>
Ejemplo de una ocultación a partir de umauna regraregla condicional:<br>
QuandoCuando oel tipo de atividadeactividad forsea "e-mail", queroquiero que oculte oel elemento de telapantalla "Local". Para todos oslos outrosotros tipos de atividadesactividades, estesestos campos devemdeben ser exibidosmostrarse normalmente. </p> <div class="box info-box">
<i class="fa fa-info-circle"> </i>
<strong>Info</strong>
<p>A<p>La regraregla condicional aplica mudançacambio de comportamentocomportamiento en noslos fomuláriosfomularios dade web ey mobile.
</div><div> <img class="img3" src="https://tdn.totvs.com/download/attachments/733191203/gif%20regras%20%281%29.gif?version=1&modificationDate=1673805185471&api=v2" alt="Image" height="80%" width="100%"> </div>
<br>
<div> <img class="img3" src="https://tdn.totvs.com/download/attachments/733191203/gif%20regras%202%20%282%29.gif?version=1&modificationDate=1673807513697&api=v2" alt="Image" height="80%" width="100%"> </div>
<br>
<p> ComCon ala regraregla aplicada, vocêusted podepuede editar, borrar excluiry esi casofuera necessárionecesario, atéincluso desabilitardeshabilitar. </p> <br> <div> <img class="img3" src="https://tdn.totvs.com/download/attachments/733191203/gif%20regras%203.gif?version=1&modificationDate=1673808144650&api=v2" alt="Image" height="80%" width="100%">
<p>Adicionamos<p>Agregamos novosnuevos íconesíconos de statusestatus de visualizaçãovisualización ey ediçãoedición, que mostrammuestran instantaneamenteinstantáneamente quaislos campos sãoque son objetosobjeto de regrasreglas condicionaiscondicionales. EstesEstos íconos íconesse sãomuestran exibidosen nala seçãosección de personalizaçãopersonalización dodel formulárioformulario — possibilitandopermitiendo tertener umun panorama de statusestatus ey açãoacción realizada por atravésmedio de regrasreglas.
<div> <center><img class="img3" src="https://tdn.totvs.com/download/attachments/733191203/Sem-t%C3%ADtulo-1.png?version=1&modificationDate=1673811615851&api=v2" alt="Image" height="60%" width="60%"> </center> </div>
<br>
</div> |
| HTML |
|---|
<style>
#title-text {
display: none !important;} @import "compass/css3"; @import "compass/css3";
* {
box-sizing: border-box;
font-family: lato;
}
blockquote {
margin: 3%;
border-left: 10px solid #363636;
padding: 2%;
color: #222;
background: #fff;
font-style: italic;
line-height: 130%;
}
.top {
width: 100%;
background: #363636;
}
.img {
image-resolution: 5px 5px 9px;
image-rendering: auto;
image-orientation:0deg
}
.header {
max-width: 1200px;
width: 98%;
height: 7em;
margin: 0px auto;
overflow: hidden;
h1 {
text-align: center;
font-weight: bold;
color: #fff;
padding: 20px;
font-size: 22px;
div {
margin: 0;
font-weight: normal;
font-size: 1.8em;
}
}
.author {
font-size: 0.8em;
font-weight: normal;
border-top: 1px dashed #555;
border-bottom: 1px dashed #555;
max-width: 160px;
text-align: center;
margin: -1em auto 0 auto;
padding: 0.3em;
text-transform: uppercase;
color: #ccc;
}
}
.content {
max-width: 750px;
margin:0px auto;
padding: 0;
}
.date {
float: left;
width: 10%;
color: #444;
text-align: center;
div {
margin: 0;
line-height: 50%;
}}
.day {
float: left;
margin-top: 0.1em;
width: 100%;
color: #FEAC0E;
font-size: 200%;
}
}
.date-line {
display: none;
}
.article {
width: 90%;
margin: 0 0 6em 0;
float: left;
padding: 0 1.3em 0 1.3em;
border-left: 5px solid #FEAC0E;
background: rgb(247, 247, 252);
}
h2 {
font-weight: normal;
font-size: 22px;
font-weight: bold;
color: #555555;
margin: 0;
}
h3 {
font-weight: normal;
font-size: 16px;
color: #888;
font-style: italic;
margin: 0 0 1em 0;
}
p {
margin: 0;
padding-top: 8px;
color: #555;
text-align: justify;
font-size: 16px;
line-height: 150%;
}
li{
font-size: 16px;
color: #555555;
}
div{
font-style: 16px;
color: #555;
}
.firstpara {
text-indent: 0;
font-size: 16px;
}
.pause {
margin: 2em auto 2em auto;
color: #555555;
width: 60%;
padding: 10px;
text-align: center;
font-size: 20px;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
.firstcharacter {
float: left;
font-size: 16px;
font-weight: bold;
color: #555;
line-height: 0.6em;
padding-top: 0.12em;
padding-right: 0.1em;
padding-left: 0;
}
}
.footer {
max-width: 1200px;
width: 98%;
height: 50px;
margin: 0px auto;
overflow: hidden;
border-top: 1px solid #ccc;}
.copy {
float: right;
font-style: italic;
color: #888;
padding: 1% 1% 0 0;
}
}
.prev a,
.next a {
position: fixed;
top: 9.6em;
padding: 1em;
background: #f1f1f1;
border: 1px solid #ccc;
border-radius: 5px;
}
.prev a:hover,
.next a:hover {
background: #fff;
}
.prev a {
left: 0.7em;
}
.next a {
right: 0.7em;
}
@media only screen and (max-width: 450px) {
.content {
margin-top: 2em;
}
.social {
display: none;
}
.date {
display: none;
}
.date-line {
display: inline;
}
.article {
width: 100%;
margin: 0 auto 2em auto;
border-left: none;
padding-bottom: 2em;
border-bottom: 1px solid #ccc;
p {
font-size: 1.2em;
}
}
.header {
height: auto;
position: fixed;
top: 0;
padding: 0;
margin: 0;
background: rgb(34, 16, 171)
h1 {
text-align: center;
width: 100%;
margin: 0;
color: #f1f1f1;
span {
font-size: 80%;
}
}
.author {
display: none;
}
}
.footer {
text-align: center;
padding: 3%;
height: 40px;
.copy {
float: none;
}
}
.prev a,
.next a {
position: relative;
margin-bottom: 2em;
text-align: center;
top: 0;
}
.prev a {
float: left;
width: 40%;
}
.next a {
float: right;
width: 40%;
}s
.table {
font-family: lato;
background-color: #fff;
}
#wrapper {
display: flex;
flex-direction: column;
gap: 2px;
position: absolute;
inset: 0;
justify-content: center;
align-items: center;
}}
.flexWrap {
display: flex;
gap: 2px;
width: 110px;
}
#disclaimer {
font-family: sans-serif;
color: #333333;
position: fixed;
top: 5%;
right: 5%;
width: 5%;
}
.badge-primary {
color: #8686FF;
background-color: #F3F3FF;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold }
.badge-secondary{
color: #ebeef0;
background-color: #2abe74;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold
}
.badge-novo {
color: #fff;
background-color: #20d691;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold }
.badge-danger{
color: #ebeef0;
background-color: #e93e9c;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold }
.badge-manutencao {
color: #FFF;
background-color: #efc307;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold;
}
.badge-melhoria {
color: #FFF;
background-color: #6f60f6;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold;
}
.badge-light {
color: #8686FF;
background-color: #F3F3FF
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold;
}
.badge-dark {
color: #ebeef0;
background-color: #064118;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold }
body {
font-family: lato;
}
table {
border-collapse: collapse;
}
th {
text-align: left;
background-color: #363636;
color: #fff;
}
caption {
font-size: 1.5rem;
text-align: left;
padding-bottom: 1rem;
}
td, th {
padding: 0.5rem;
border: 3px solid #fff;
}
tbody tr:nth-child(odd),
tfoot tr:nth-child(even) {
background-color: #fff;
}
tfoot tr td:first-child {
border: none;
background-color: white;
}
tfoot {
border-top: 5px solid #fff;
}
.img2 {
width:50%;
height:auto;
padding:2%;
margin-bottom:4%;
align-content: center;
display: block;
margin-left: auto;
margin-right: auto }
#f7f7fc;
}
}
container{
width: 50%;
}
.borderbox{
border: 1px dashed #ebebeb;
width:45%;
margin: 50px auto;
border-radius: 8px;
border-width:2px;
}
.box{
position:relative;
width:auto;
height:auto;
margin: 50px auto;
padding: 20px;
box-shadow: 0px 1px 8px 1px #ebebeb;
border-radius: 8px;
}
.sucess-box{
border-left: solid 5px #3FC43C;
background-color: #fff;
} .info-box{
border-left: solid 5px #585EC2;
background-color: #fff;
}
.warning-box{
border-left: solid 5px #EFA162;
background-color: #fff;
}
.error-box{
border-left: solid 5px #F32D70;
background-color: #fff;
}
.fa{
padding-right:10px;
}
.fa-check-circle{
color: #3FC43C;
}
.fas fa-info-circle
{
color: #585EC2;
}
.warning-box .fa-exclamation-triangle{
color: #EFA162;
}
.error-box .fa-exclamation-triangle{
color: #E63470;
}
p{
padding:0px 28px;
}
.time{
color:#9b9b9b;
}
.fa-close{
color:#BCC4CD;
}
.close{
position:absolute;
top: 20px;
right:20px;
}
.link1,
.link2,
.link3,
.link4{
opacity:0;
margin-left:20px;
text-decoration:none;
}
.link1{
color:#3FC43C;
}
.link2{
color:#585EC2;
}
.link3{
color:#EFA162;
}
.link4{
color:#E63470;
}
.box:hover a{
opacity:1;
}
</style> |
| HTML |
|---|
<div class="speech-row">
<div class="speech-img"><a href="https://totvscst.zendesk.com/hc/pt-br/#home" target="_blank"><img src="https://tdn.totvs.com/download/attachments/731900022/01.png?version=1&modificationDate=1673107757259&api=v2" alt="Assistente virtual"></a></div>
<div class="speech-bubble"><b>Olá><b>¡Hola!👋</b> SouSoy a Carolina, assistenteasistente virtual dade TOTVS. Ainda¿Aún temtiene dúvidasdudas? Acesse¡Acceda a la central de ajudaayuda ey explore todos oslos conteúdoscontenidos oferecidosofrecidos pelapor TOTVS CRM - GestãoGestión de Clientesclientes! </div>
</div> |
| HTML |
|---|
<style> body {
margin: 0; // 1
font-family: lato;
font-size: 16px;
font-weight: $font-weight-base;
line-height: $line-height-base;
color: #555555
text-align: left; // 3
background-color: $body-bg; // 2
}
.speech-bubble {
max-width: 300px;
font-family: lato;
color: #555555;
font-size: 16px;
margin: 1rem;
padding: 1rem;
position: relative;
border: 2px solid #FEAC0E;
background: #fff;
border-radius: 0.4em;
}
.speech-row {
display: flex;
justify-content: center;
}
img {
overflow-clip-margin: content-box;
overflow: clip;
}
.speech-img img {
border-radius: 50%;
}
img {
vertical-align: middle;
border-style: none;
}
.speech-img {
align-self: center;
max-width: 100%;
height: auto;
}
*,
::after,
::before {
box-sizing: border-box;
}
img {
overflow-clip-margin: content-box;
overflow: clip;
}
.speech-bubble:before,
.speech-bubble:after {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 0;
height: 0;
border: 20px solid transparent;
border-right-color: #FEAC0E;
border-left: 0;
margin-top: -20px;
margin-left: -20px;
}
.speech-bubble:after {
border-right-color: #fff;
margin-left: -18px;
z-index: 1;
}
</style> |
Visão Geral
Import HTML Content
Conteúdo das Ferramentas
Tarefas