autodocumentacion de campos

This commit is contained in:
humano 2018-11-15 17:05:45 -05:00
parent 7771785e1c
commit 8ca534270c
2 changed files with 105 additions and 84 deletions

View File

@ -674,79 +674,23 @@ div#contenedor_landingpage {
/*-------------
Help-tip Style
---------------*/
.help-tip {
position: absolute;
top: -.2em; right: 1.1em;
//border: 1px solid red;
}
.help-tip::before { /*question sign*/
content: "?";
position: absolute;
top: 0; right: 0;
font-size: 1.2em;
padding: .1em .6em;
border-radius: 50%;
font-weight: bold;
cursor: help;
background: #1565c0;
color: #f9f9f9;
box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}
.help-tip__content {
position: absolute;
top: 2.75em; right: -.2em;
min-width: 15em;
padding: .5em 1em;
background: rgba(31, 35, 39, 0.9);
color: #f9f9f9;
border-radius: .2em;
box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
z-index: 2;
transform-origin: 95% -1%;
transform: scale(0);
transition: transform .2s ease;
}
.help-tip__content::before { /*pointer of the help-tip*/
content: "";
position: absolute;
top: -1.35em; right: .6em;
border: .7em solid transparent;
border-bottom-color: rgba(31, 35, 39, 0.9);
}
.help-tip__content::after { /*prevents help-tip from being hidden when mouse moves from the question sign down to the content*/
content: "";
position: absolute;
width: 60%;
min-height: 2em;
top: -2em; right: 0;
//background: red;
}
.help-tip:hover .help-tip__content,
.help-tip:focus .help-tip__content{
transform: scale(1);
}
@supports(filter: drop-shadow(0 0 0 #ccc)) { /*for browsers that support filter: drop-shadow, we add it and remove box-shadow*/
.help-tip__content {
box-shadow: none;
filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, .5));
}
/* CSS animation */
@-webkit-keyframes fadeIn {
0% {
opacity:0;
transform: scale(0.6);
}
100% {
opacity:100%;
transform: scale(1);
}
}
@supports(display: flex) { /*for browsers that support display: flex*/
.help-tip__content {
display: flex;
flex-flow: column;
flex-wrap: wrap;
}
@keyframes fadeIn {
0% { opacity:0; }
100% { opacity:100%; }
}

View File

@ -7,12 +7,84 @@ use Firebase\JWT\JWT;
function documentar($titulo,$descripcion,$id){
$resultado ="
<div class='help-tip' role='tooltip' id='$id'>
<div class='help-tip__content'>
<h3 class='help-tip__title'>$titulo</h3>
<p class='help-tip__text'>$descripcion</p>
</div>
</div>";
<div class='help-tip-$id' role='tooltip' id='$id' >
<div>$titulo <i> <h3>$descripcion</h3></i></div>
</div>
<style>
.help-tip-$id{
position: absolute;
//top: 18px;
//right: 18px;
text-align: center;
background-color: #999999;
border-radius: 5 px;
width: 15px;
height: 15px;
font-size: 10px;
//line-height: 26px;
cursor: default;
z-index:20;
}
.help-tip-$id:before{
content:'?';
font-weight: bold;
color:#fff;
}
.help-tip-$id:hover div{
display:block;
transform-origin: 100% 0%;
-webkit-animation: fadeIn 0.3s ease-in-out;
animation: fadeIn 0.3s ease-in-out;
z-index:22;
}
.help-tip-$id div{ /* The tooltip */
display: none;
text-align: left;
background-color: #1E2021;
padding: 20px;
width: 300px;
position: absolute;
border-radius: 3px;
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
//right: -4px;
color: #FFF;
font-size: 13px;
line-height: 1.4;
z-index:20;
}
.help-tip-$id div:before{ /* The pointer of the tooltip */
position: absolute;
content: '';
width:0;
height: 0;
border:6px solid transparent;
border-bottom-color:#1E2021;
// right:10px;
top:-12px;
}
.help-tip-$id div:after{ /* Prevents the tooltip from being hidden */
width:100%;
height:40px;
content:'';
position: absolute;
top:-40px;
left:0;
}
</style>
";
return $resultado;
}
@ -16603,10 +16675,10 @@ elseif($campo_tipo_accion == 'email'){$render = "
$remplace = preg_replace($regex,$sustitucion,$campos_valores[0]);
$remplace= "( $remplace )";
//$campos = print_r($matches,true);
//$documentar= documentar("el titulo","la descripcion","".$id_campo."[".$item."]");
$render = "
<div class='input-group' >
<input title = '$campo_descripcion' type='text' value='$value' id='".$id_campo."[".$item."]' name='".$id_campo."[".$item."]' class='form-control' placeholder='$campos_valores[0]' aria-describedby='".$id_campo."[".$item."]-tooltip' readonly>
<input title = '$campo_descripcion' type='text' value='$value' id='".$id_campo."[".$item."]' name='".$id_campo."[".$item."]' class='form-control' placeholder='$campos_valores[0]' readonly>
<span class='input-group-btn'>
<div class='btn btn-warning' onclick=\"javascript: document.getElementById('".$id_campo."[".$item."]').value= eval($remplace); \">Calcular </div>
</span>
@ -16788,18 +16860,22 @@ $boton= " <div class='btn btn-primary btn-link' onclick=\"xajax_campo_multiple
";*/
}
if($item == 0) { $label = "<label class='label_formulario' for='$id_campo"."_".$item."' title='$id_campo'> <span class='text-$obligatorio'>$campo_nombre</span> </label>";}
else {$label = "<label class=' label_formulario sr-only' for='$id_campo"."_".$item."'>$campo_nombre $campo_obligatorio</label>";}
if($item == 0) { $label = "<label class='label_formulario' for='$id_campo"."_".$item."' title='$id_campo' > <span class='text-$obligatorio'>$campo_nombre</span> </label>";}
else {$label = "<label class=' label_formulario sr-only' for='$id_campo"."_".$item."' >$campo_nombre $campo_obligatorio</label>";}
///// CAMPOS QUE NO SE MOSTRARAN
// if($campo_tipo_accion == 'imagen'){ $label=""; $campo_descripcion=""; }
if($cols =="") {$cols = "6";}
if($campo_descripcion !=""){
$documentar= documentar("$campo_nombre","$campo_descripcion","$id_campo");
}else{ $documentar="";}
$input = "
<div class='col-md-$cols' style='$style'>
<div class='form-group ' id='input_".$id_campo."[".$item."]' >
$label
<div class='col-md-12' data-html='true' data-toggle='tooltip' data-placement='top' title='$campo_descripcion'>
$render
$label
<div class='col-md-12' data-html='true' data-toggle='tooltip' data-placement='top' title='$campo_descripcion' >
$documentar $render
<small></small>
</div>
</div>
@ -16809,6 +16885,7 @@ $boton= " <div class='btn btn-primary btn-link' onclick=\"xajax_campo_multiple
<div class='' id='multiple_id_campo_$id_campo"."_".$item."'>
<div id='boton_$id_campo'>$boton</div>
</div>
";