Você não está conectado. Conecte-se ou registre-se

Fazer o Plugin do JotForm fica com a cor de fundo #FFD401

Ver o tópico anterior Ver o tópico seguinte Ir em baixo  Mensagem [Página 1 de 1]

AngelWars

avatar
Membro ativo

[quadrado=Minha questão]
Pessoal, gostaria de pedir a ajuda de vocês com meu forum, bom eu quero que
o formulário fique com a mesma cor de fundo para poder combinar, isso é possível?

Código:
<script src="http://portuguese.phishing-site.www/static/prototype.forms.js" type="text/javascript"></script>
<script src="http://portuguese.phishing-site.www/static/jotform.forms.js?3.2.5178" type="text/javascript"></script>
<script type="text/javascript">
   JotForm.init(function(){
      JotForm.description('input_16', 'Prezado(a) cliente, você está concordando com o pequeno contrato de descrito, na parte superior do formulário cuja sua cor está destacado de vermelho.Caso não concorde com nossos termo, favor não preencha o formulário.');
      JotForm.description('input_17', 'Selecione o número de 1 a 5.');
      JotForm.alterTexts({"alphabetic":"This field can only contain letters","alphanumeric":"This field can only contain letters and numbers.","characterLimitError":"Too many Characters.  The limit is","confirmClearForm":"Are you sure you want to clear the form?","confirmEmail":"E-mail does not match","currency":"This field can only contain currency values.","email":"Enter a valid e-mail address","fillMask":"Field value must fill mask.","generalError":"There are errors on the form. Please fix them before continuing.","generalPageError":"There are errors on this page. Please fix them before continuing.","gradingScoreError":"Score total should only be less than or equal to","incompleteFields":"There are incomplete required fields. Please complete them.","inputCarretErrorA":"Input should not be less than the minimum value:","inputCarretErrorB":"Input should not be greater than the maximum value:","lessThan":"Your score should be less than or equal to","maxDigitsError":"The maximum digits allowed is","maxSelectionsError":"The maximum number of selections allowed is","minSelectionsError":"The minimum required number of selections is","multipleFileUploads_emptyError":"{file} is empty, please select files again without it.","multipleFileUploads_fileLimitError":"Only {fileLimit} file uploads allowed.","multipleFileUploads_minSizeError":"{file} is too small, minimum file size is {minSizeLimit}.","multipleFileUploads_onLeave":"The files are being uploaded, if you leave now the upload will be cancelled.","multipleFileUploads_sizeError":"{file} is too large, maximum file size is {sizeLimit}.","multipleFileUploads_typeError":"{file} has invalid extension. Only {extensions} are allowed.","numeric":"This field can only contain numeric values","pastDatesDisallowed":"Date must not be in the past.","pleaseWait":"Please wait...","required":"This field is required.","requireEveryCell":"Every cell is required.","requireEveryRow":"Every row is required.","requireOne":"At least one field required.","submissionLimit":"Sorry! Only one entry is allowed.  Multiple submissions are disabled for this form.","uploadExtensions":"You can only upload following files:","uploadFilesize":"File size cannot be bigger than:","wordLimitError":"Too many words. The limit is"});
   });
</script>
<link href="http://portuguese.phishing-site.www/static/formCss.css?3.2.5178" rel="stylesheet" type="text/css" />
<link type="text/css" media="print" rel="stylesheet" href="http://portuguese.phishing-site.www/css/printForm.css?3.2.5178" />
<style type="text/css">
    .form-label-left{
        width:150px !important;
    }
    .form-line{
        padding-top:12px;
        padding-bottom:12px;
    }
    .form-label-right{
        width:150px !important;
    }
    .form-all{
        width:690px;
        color:#555 !important;
        font-family:'Lucida Grande';
        font-size:16px;
    }
    .form-radio-item label, .form-checkbox-item label, .form-grading-label, .form-header{
        color: #555;
    }

</style>

<link type="text/css" rel="stylesheet" href="http://portuguese.phishing-site.www/themes/CSS/54945ae9700cc494668b4567.css?session=46955758998786&themeRevisionID=54abfa5c25d790545b8b4567"/>
<style type="text/css" id="form-designer-style">
    /* Injected CSS Code */
.form-all {
  font-family: "Lucida Grande", sans-serif;
}
.form-all {
  width: 690px;
}
.form-label-left,
.form-label-right {
  width: 150px;
}
.form-label {
  white-space: normal;
}
.form-label.form-label-auto {
  display: inline-block;
  float: left;
  text-align: right;
  width: 150px;
}
.form-label-left {
  display: inline-block;
  white-space: normal;
  float: left;
  text-align: left;
}
.form-label-right {
  display: inline-block;
  white-space: normal;
  float: left;
  text-align: right;
}
.form-label-top {
  white-space: normal;
  display: block;
  float: none;
  text-align: left;
}
.form-all {
  font-size: 16px;
}
.form-label {
  font-weight: bold;
}
.form-checkbox-item label,
.form-radio-item label {
  font-weight: normal;
}
.supernova {
  background-color: #ffffff;
  background-color: #fafafa;
}
.supernova body {
  background-color: transparent;
}
/*
@width30: (unit(@formWidth, px) + 60px);
@width60: (unit(@formWidth, px)+ 120px);
@width90: (unit(@formWidth, px)+ 180px);
*/
/* | */
@media screen and (min-width: 480px) {
  .supernova .form-all {
    border: 1px solid #e1e1e1;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.1);
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.1);
  }
}
/* | */
/* | */
@media screen and (max-width: 480px) {
  .jotform-form {
    padding: 10px 0;
  }
}
/* | */
/* | */
@media screen and (min-width: 480px) and (max-width: 768px) {
  .jotform-form {
    padding: 30px 0;
  }
}
/* | */
/* | */
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .jotform-form {
    padding: 60px 0;
  }
}
/* | */
/* | */
@media screen and (min-width: 1024px) {
  .jotform-form {
    padding: 90px 0;
  }
}
/* | */
.form-all {
  background-color: #ffffff;
  border: 1px solid transparent;
}
.form-header-group {
  border-color: #e6e6e6;
}
.form-matrix-table tr {
  border-color: #e6e6e6;
}
.form-matrix-table tr:nth-child(2n) {
  background-color: #f2f2f2;
}
.form-all {
  color: #555555;
}
.form-header-group .form-header {
  color: #555555;
}
.form-header-group .form-subHeader {
  color: #6f6f6f;
}
.form-sub-label {
  color: #6f6f6f;
}
.form-label-top,
.form-label-left,
.form-label-right,
.form-html {
  color: #555555;
}
.form-checkbox-item label,
.form-radio-item label {
  color: #6f6f6f;
}
.form-line.form-line-active {
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -ms-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
  -moz-transition-timing-function: ease;
  -ms-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
  background-color: #ffffe0;
}
/* ömer */
.form-radio-item,
.form-checkbox-item {
  padding-bottom: 0px !important;
}
.form-radio-item:last-child,
.form-checkbox-item:last-child {
  padding-bottom: 0;
}
/* ömer */
.form-single-column .form-checkbox-item,
.form-single-column .form-radio-item {
  width: 100%;
}
.supernova {
  height: 100%;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center top;
  background-repeat: repeat;
}
.supernova {
  background-image: none;
}
#stage {
  background-image: none;
}
/* | */
.form-all {
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center top;
  background-repeat: repeat;
}
.form-header-group {
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center top;
}
.form-line {
  margin-top: 0px;
  margin-bottom: 0px;
}
.form-line {
  padding: 0px 36px;
}
.form-all .form-textbox,
.form-all .form-radio-other-input,
.form-all .form-checkbox-other-input,
.form-all .form-captcha input,
.form-all .form-spinner input,
.form-all .form-pagebreak-back,
.form-all .form-pagebreak-next,
.form-all .qq-upload-button,
.form-all .form-error-message {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
}
.form-all .form-sub-label {
  margin-left: 3px;
}
.form-all .form-textarea {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
}
.form-all {
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
}
.form-section:first-child {
  -webkit-border-radius: 20px 20px 0 0;
  -moz-border-radius: 20px 20px 0 0;
  border-radius: 20px 20px 0 0;
}
.form-section:last-child {
  -webkit-border-radius: 0 0 20px 20px;
  -moz-border-radius: 0 0 20px 20px;
  border-radius: 0 0 20px 20px;
}
.form-all .qq-upload-button,
.form-all .form-submit-button,
.form-all .form-submit-reset,
.form-all .form-submit-print {
  font-size: 1em;
  padding: 9px 15px;
  font-family: "Lucida Grande", sans-serif;
  font-size: 16px;
  font-weight: normal;
}
.form-all .form-pagebreak-back,
.form-all .form-pagebreak-next {
  font-size: 1em;
  padding: 9px 15px;
  font-family: "Lucida Grande", sans-serif;
  font-size: 16px;
  font-weight: normal;
}
/*
& when ( @buttonFontType = google ) {
   @import (css) "@{buttonFontLink}";
}
*/
h2.form-header {
  line-height: 1.618em;
  font-size: 1.714em;
}
h2 ~ .form-subHeader {
  line-height: 1.5em;
  font-size: 1.071em;
}
.form-header-group {
  text-align: left;
}
/*.form-dropdown,
.form-radio-item,
.form-checkbox-item,
.form-radio-other-input,
.form-checkbox-other-input,*/
.form-captcha input,
.form-spinner input,
.form-error-message {
  padding: 4px 3px 2px 3px;
}
.form-header-group {
  font-family: "Lucida Grande", sans-serif;
}
.form-section {
  padding: 0px 0px 0px 0px;
}
.form-header-group {
  margin: 12px 36px 12px 36px;
}
.form-header-group {
  padding: 24px 0px 24px 0px;
}
.form-textbox,
.form-textarea {
  padding: 4px 3px 2px 3px;
}
.form-textbox,
.form-textarea,
.form-radio-other-input,
.form-checkbox-other-input,
.form-captcha input,
.form-spinner input {
  background-color: #ffffff;
}
[data-type="control_dropdown"] .form-input,
[data-type="control_dropdown"] .form-input-wide {
  width: 150px;
}
.form-label {
  font-family: "Lucida Grande", sans-serif;
}
li[data-type="control_image"] div {
  text-align: left;
}
li[data-type="control_image"] img {
  border: none;
  border-width: 0px !important;
  border-style: solid !important;
  border-color: false !important;
}
.form-line-column {
  width: auto;
}
.form-line-error {
  overflow: hidden;
  -webkit-transition-property: none;
  -moz-transition-property: none;
  -ms-transition-property: none;
  -o-transition-property: none;
  transition-property: none;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
  -moz-transition-timing-function: ease;
  -ms-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
  background-color: #fff4f4;
}
.form-line-error .form-error-message {
  background-color: #ff3200;
  clear: both;
  float: none;
}
.form-line-error .form-error-message .form-error-arrow {
  border-bottom-color: #ff3200;
}
.form-line-error input:not(#coupon-input),
.form-line-error textarea,
.form-line-error .form-validation-error {
  border: 1px solid #ff3200;
  -webkit-box-shadow: 0 0 3px #ff3200;
  -moz-box-shadow: 0 0 3px #ff3200;
  box-shadow: 0 0 3px #ff3200;
}
.ie-8 .form-all {
  margin-top: auto;
  margin-top: initial;
}
.ie-8 .form-all:before {
  display: none;
}
/* | */
@media screen and (max-width: 480px), screen and (max-device-width: 768px) and (orientation: portrait), screen and (max-device-width: 415px) and (orientation: landscape) {
  .jotform-form {
    padding: 0;
  }
  .form-all {
    border: 0;
    width: 100%;
    max-width: initial;
  }
  .form-sub-label-container {
    width: 100%;
    margin: 0;
  }
  .form-input {
    width: 100%;
  }
  .form-label {
    width: 100%!important;
  }
  .form-line {
    padding: 2% 5%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  input[type=text],
  input[type=email],
  input[type=tel],
  textarea {
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    max-width: initial !important;
  }
  .form-input,
  .form-input-wide,
  .form-textarea,
  .form-textbox,
  .form-dropdown {
    max-width: initial !important;
  }
  div.form-header-group {
    padding: 24px 0px !important;
    margin: 0 12px 2% !important;
    margin-left: 5% !important;
    margin-right: 5% !important;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  [data-type="control_button"] {
    margin-bottom: 0 !important;
  }
  .form-buttons-wrapper {
    margin: 0!important;
  }
  .form-buttons-wrapper button {
    width: 100%;
  }
  table {
    width: 100%!important;
    max-width: initial !important;
  }
  table td + td {
    padding-left: 3%;
  }
  .form-checkbox-item input,
  .form-radio-item input {
    width: auto;
  }
  .form-collapse-table {
    margin: 0 5%;
  }
}
/* | */

/*__INSPECT_SEPERATOR__*/

    /* Injected CSS Code */
</style>

<form class="jotform-form" action="http://portuguese.phishing-site.www/submit.php" method="post" name="form_43027770045652" id="43027770045652" accept-charset="utf-8">
  <input type="hidden" name="formID" value="43027770045652" />
  <div class="form-all">
    <ul class="form-section">
      <li id="cid_1" class="form-input-wide" data-type="control_head">
        <div class="form-header-group">
          <div class="header-text httac htvam">
            <h2 id="header_1" class="form-header">
              Pedido de Banda Larga | HOTSPOT HYGOR
            </h2>
          </div>
        </div>
      </li>
      <li class="form-line jf-required" data-type="control_textbox" id="id_9">
        <label class="form-label form-label-right form-label-auto" id="label_9" for="input_9">
          Nome Completo
          <span class="form-required">
            *
          </span>
        </label>
        <div id="cid_9" class="form-input jf-required">
          <input type="text" class=" form-textbox validate[required]" data-type="input-textbox" id="input_9" name="q9_nomeCompleto" size="35" value="" />
        </div>
      </li>
      <li class="form-line jf-required" data-type="control_textbox" id="id_12">
        <label class="form-label form-label-right form-label-auto" id="label_12" for="input_12">
          Endereço
          <span class="form-required">
            *
          </span>
        </label>
        <div id="cid_12" class="form-input jf-required">
          <input type="text" class=" form-textbox validate[required]" data-type="input-textbox" id="input_12" name="q12_endereco12" size="35" value="" />
        </div>
      </li>
      <li class="form-line jf-required" data-type="control_textbox" id="id_11">
        <label class="form-label form-label-right form-label-auto" id="label_11" for="input_11">
          CPF
          <span class="form-required">
            *
          </span>
        </label>
        <div id="cid_11" class="form-input jf-required">
          <input type="text" class=" form-textbox validate[required]" data-type="input-textbox" id="input_11" name="q11_cpf11" size="11" value="" />
        </div>
      </li>
      <li class="form-line jf-required" data-type="control_textbox" id="id_14">
        <label class="form-label form-label-right form-label-auto" id="label_14" for="input_14">
          Telefone
          <span class="form-required">
            *
          </span>
        </label>
        <div id="cid_14" class="form-input jf-required">
          <input type="text" class=" form-textbox validate[required]" data-type="input-textbox" id="input_14" name="q14_telefone" size="11" value="" />
        </div>
      </li>
      <li class="form-line jf-required" data-type="control_textbox" id="id_3">
        <label class="form-label form-label-right form-label-auto" id="label_3" for="input_3">
          E-mail
          <span class="form-required">
            *
          </span>
        </label>
        <div id="cid_3" class="form-input jf-required">
          <input type="text" class=" form-textbox validate[required]" data-type="input-textbox" id="input_3" name="q3_email3" size="20" value="" />
        </div>
      </li>
      <li class="form-line jf-required" data-type="control_dropdown" id="id_13">
        <label class="form-label form-label-right form-label-auto" id="label_13" for="input_13">
          Plano de Banda
          <span class="form-required">
            *
          </span>
        </label>
        <div id="cid_13" class="form-input jf-required">
          <select class="form-dropdown validate[required]" style="width:150px" id="input_13" name="q13_planoDe">
            <option value="">  </option>
            <option value="800 KBPS por R$ 30,00"> 800 KBPS por R$ 30,00 </option>
            <option value="2 MB por R$ 60,00"> 2 MB por R$ 60,00 </option>
            <option value="5 MB por R$ 80,00"> 5 MB por R$ 80,00 </option>
            <option value="10 MB por R$ 100,00"> 10 MB por R$ 100,00 </option>
          </select>
        </div>
      </li>
      <li class="form-line jf-required" data-type="control_radio" id="id_16">
        <label class="form-label form-label-right form-label-auto" id="label_16" for="input_16">
          Concorda com termo?
          <span class="form-required">
            *
          </span>
        </label>
        <div id="cid_16" class="form-input jf-required">
          <div class="form-single-column">
            <span class="form-radio-item" style="clear:left;">
              <input type="radio" class="form-radio validate[required]" id="input_16_0" name="q16_concordaCom16" value="Sim, eu concordo." />
              <label for="input_16_0"> Sim, eu concordo. </label>
            </span>
            <span class="clearfix">
            </span>
          </div>
        </div>
      </li>
      <li class="form-line" data-type="control_scale" id="id_17">
        <label class="form-label form-label-right form-label-auto" id="label_17" for="input_17"> Nos avalie </label>
        <div id="cid_17" class="form-input jf-required">
          <table summary="" cellpadding="4" cellspacing="0" class="form-scale-table">
            <tr>
              <th>
                 
              </th>
              <th align="center">
                <label for="input_17_1"> 1 </label>
              </th>
              <th align="center">
                <label for="input_17_2"> 2 </label>
              </th>
              <th align="center">
                <label for="input_17_3"> 3 </label>
              </th>
              <th align="center">
                <label for="input_17_4"> 4 </label>
              </th>
              <th align="center">
                <label for="input_17_5"> 5 </label>
              </th>
              <th>
                &nbsp;
              </th>
            </tr>
            <tr>
              <td>
                <label for="input_17_1"> Ruim </label>
              </td>
              <td align="center">
                <input class="form-radio" type="radio" name="q17_nosAvalie" value="1" title="1" id="input_17_1" />
              </td>
              <td align="center">
                <input class="form-radio" type="radio" name="q17_nosAvalie" value="2" title="2" id="input_17_2" />
              </td>
              <td align="center">
                <input class="form-radio" type="radio" name="q17_nosAvalie" value="3" title="3" id="input_17_3" />
              </td>
              <td align="center">
                <input class="form-radio" type="radio" name="q17_nosAvalie" value="4" title="4" id="input_17_4" />
              </td>
              <td align="center">
                <input class="form-radio" type="radio" name="q17_nosAvalie" value="5" title="5" id="input_17_5" />
              </td>
              <td>
                <label for="input_17_5"> Excelente </label>
              </td>
            </tr>
          </table>
        </div>
      </li>
      <li class="form-line" data-type="control_button" id="id_18">
        <div id="cid_18" class="form-input-wide">
          <div style="text-align:center" class="form-buttons-wrapper">
            <button id="input_18" type="submit" class="form-submit-button">
              Enviar Agora
            </button>
          </div>
        </div>
      </li>
      <li style="display:none">
        Should be Empty:
        <input type="text" name="website" value="" />
      </li>
    </ul>
  </div>
  <input type="hidden" id="simple_spc" name="simple_spc" value="43027770045652" />
  <script type="text/javascript">
  document.getElementById("si" + "mple" + "_spc").value = "43027770045652-43027770045652";
  </script>
</form>



Endereço do meu fórum:
http://www.hotspothygor.net/

Versão:
PunBB[/quadrado]

Ver perfil do usuário

HeroWaar

avatar
Membro elite

Olá,

Não seria mais fácil colocar diretamente pela interface de criação e utilizar somente o código JS para importação?

HW,

Ver perfil do usuário http://badlands.com.br/

AngelWars

avatar
Membro ativo

É porque eu não entendo disso amigo, qual opção escolho para gerar o código?

Ver perfil do usuário

Alex Habilidade

avatar
Membro ativo

Olá,

Tente com o Embed e caso não funcione tente com o iFrame

Ver perfil do usuário

AngelWars

avatar
Membro ativo

@Alex Habilidade escreveu:Olá,

Tente com o Embed e caso não funcione tente com o iFrame
Veja como fico com iFrame. http://www.hotspothygor.net/h4-Teste
Por favor você não consegui modificar a cor editando o HTML?
é por que não sei muito, a cor que eu desejo é # #FFD401
ou fundo transparente se for possível.

Ver perfil do usuário

Alex Habilidade

avatar
Membro ativo

Olá,

Qual cor o senhor quer mudar seria o amarelo?

Ver perfil do usuário

AngelWars

avatar
Membro ativo

Ver perfil do usuário

Alex Habilidade

avatar
Membro ativo

Olá,

Adicione em sua folha CSS:
Código:

body {
    background-color: transparent;
}

No lugar de transparent troque pela cor hexadecimal que desejar.

Ver perfil do usuário

AngelWars

avatar
Membro ativo

@Alex Habilidade escreveu:Olá,

Adicione em sua folha CSS:
Código:

body {
    background-color: transparent;
}

No lugar de transparent troque pela cor hexadecimal que desejar.
agora você falo grego pra mim kkkkkkk, bom vou tentar lhe explicar, eu quero que o formulário fica com a cor já citada assim e dentro dele fica com a cor que se encontra.

Exemplo: http://i.imgur.com/fVi0sXk.png

Ver perfil do usuário

AngelWars

avatar
Membro ativo

Podem fechar o tópico, eu mesmo consegui resolver =D.

Ver perfil do usuário

Conteúdo patrocinado


Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo  Mensagem [Página 1 de 1]

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum