Criação de código

Item: Criação de código
Rating: 1

por Tornado10 06.05.24 22:34

Detalhes da questão

Endereço do fórum: https://www.pmhabbo.com/
Versão do fórum: ModernBB

Descrição

Saudações,

eu gostaria, se possível, de receber uma ajuda na criação e implementação de um código html como opção em uma página do meu fórum.
Sou bem leigo com isso e preciso muito deste suporte, estarei detalhando abaixo para que fique possível a criação e instrução de como implanta-lo.

https://imgur.com/a/M4rFa7X

Conforme nos prints do link acima, mas agora para remoção, preciso de um código com os campos para remoção.
Link do forms: https://www.pmhabbo.com/h72-

Os campos seriam:

REGRESSO DE PASSE

Seu nick:
Patente/cargo:
TAG:
Dados do passe:
Nick do executivo:
Passe regredido: Oficial / Promotor / Remoção

Código de postagem:

Código::  <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Requerimento: Registro de passe</title> <link rel="icon" type="image/x-icon" href="https://www.habbo.com.br/habbo-imaging/badge/b22134s36044s85015s95014s96013dd911246822191a7ffb37b8e407217aa.gif" /> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" /> <link rel="stylesheet" href="https://meyerweb.com/eric/tools/css/reset/reset.css" /> <style type="text/css"> body { height: 100vh; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-size: 1em; line-height: 1.5em; } a, a:active, a:link, a:visited, a:focus { color: #fff; text-decoration: none; } h2 { display: block; width: 100%; margin: 30px 0; padding-bottom: 5px; text-align: left; font-size: 1.2em; font-weight: 400; border-bottom: 2px solid #0c78a6; cursor: default; } p { cursor: default; } label { margin-left: 6px; } input, select, textarea { padding: 6px 5px; margin: 5px; font-size: 1em; color: #555; border-radius: 6px; border: 1px solid #d4d4d4; } input[type="text"]:disabled { background: #ddd; cursor: not-allowed; } input::placeholder { color: #9b9b9b; } .caixa { text-align: center; margin-bottom: 25px; padding: 15px; color: #555; border: 1px solid #d4d4d4; box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2); } .caixa:last-of-type { margin-top: 20px; } .container-forms { display: flex; flex-direction: row; } .coluna { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 100%)); text-align: start; width: 100%; } .pill { cursor: default; margin-left: 5px; padding: 3px 4px; font-size: 0.5em; font-weight: 700; color: #fff; border: 1px solid black; border-radius: 15px; background-color: rgb(207, 0, 0); box-shadow: inset 0 3px rgb(255 255 255 / 20%), inset 0 -4px rgb(0 0 0 / 10%), inset 0 -25px rgb(0 0 0 / 3%), inset 0 0 0 1px rgb(0 0 0 / 25%); } .botao { width: 90%; margin: 15px auto 5px; padding: 10px; background: #0c78a6; color: #fff; border-radius: 3px; border-color: #375e7f; cursor: pointer; outline: none; font-size: 0.9em; font-weight: 600; transition: linear all 125ms; } .botao:hover { background: #444; border-color: #444; box-shadow: inset 0 -100px rgba(108, 108, 108, 0.1); transition: linear all 125ms; } .botao:last-of-type { margin-bottom: 0; } #container { display: flex; flex-direction: column; justify-content: center; margin: 0 auto; width: 50%; max-width: 675px; } #caixa-logo { display: flex; flex-direction: column; justify-content: center; align-items: center; } #logo { width: 210px; display: block; } #botao-voltar { display: block; float: left; color: #0c78a6; transition: linear all 125ms; } #botao-voltar:hover { color: #444; transition: linear all 125ms; } @media screen and (max-width: 1090px) { body { font-size: 90%; } #container { width: 90%; } .container-forms { flex-direction: column; } } </style> <div id="container"> <div id="caixa-logo"> <a href="https://pmhh.forumeiros.com/"> <img id="logo" src="https://i.imgur.com/KA6vUCb.png" title="Voltar ao fórum da PMHH" /> </a> </div> <div class="caixa"> <a id="botao-voltar" href="/h72-"><em class="fas fa-arrow-left"></em></a> <p style="text-align: center"> Preencha os dados corretamente. No caso dos campos opcionais, se não houverem dados relevantes, deixe vazio. </p> <h2> Dados do promotor </h2> <form id="form-content"> <div class="container-forms"> <div class="coluna"> <label for="promotor">Seu nick:</label> <input type="text" id="promotor" placeholder="" required="" /> </div> <div class="coluna"> <label for="patente">Sua patente (ou cargo):</label> <input type="text" id="patente" placeholder="" required="" /> </div> <div class="coluna"> <label for="tag">Sua TAG:</label> <input type="text" id="tag" placeholder="Sem [ ]" maxlength="4" required="" /> </div> </div> <h2> Dados do passe </h2> <div style="display: none"> <label for="dataPasse">Data do passe:</label> <input type="text" id="dataPasse" placeholder="" disabled="" /> </div> <div class="container-forms"> <div class="coluna"> <label for="executivo">Nick do executivo:</label> <input type="text" id="executivo" placeholder="" required="" /> </div> <div class="coluna"> <label for="passe">Passe recebido:</label> <select data-type="select" id="passe" required=""> <option value="Promotor">Promotor</option> <option value="Oficial">Oficial</option> <option value="Alto Comando">Alto Comando</option> </select> </div> </div> <div style="margin-top: 25px; cursor: default"> <input id="check" type="checkbox" name="termos" value="X" required="" /> Li e concordo com as normas do passe executivo. </div> <button class="botao" type="submit"> Enviar </button> </form> </div> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script> const pegaData = new Date(); let mes = ["Jan", "Fev", "Mar", "Abr", "Mai", "Jun", "Jul", "Ago", "Set", "Out", "Nov", "Dez"]; let dia = !!pegaData.getDate().toString()[1] ? pegaData.getDate() : "0" + pegaData.getDate(); const pegaMes = pegaData.getMonth(); const ano = pegaData.getFullYear(); let data = [dia, mes[pegaMes], ano].join(" "); document.getElementById("dataPasse").value = data; (function ($) { "use strict"; $(function () { $("#form-content").on("submit", function (event) { var data = { promotor: $("#promotor").val(), patente: $("#patente").val(), tag: $("#tag").val(), dataPasse: $("#dataPasse").val(), executivo: $("#executivo").val(), passe: $("#passe").val(), termos: "x", }; event.preventDefault(); setTimeout(function () { $.post("/post", { t: 3269, message: [ `[b][color=#0C78A6]Modelo VI - Registro de passe[/color][/b] [b]Patente/cargo e nick:[/b] ${data.patente} ${data.promotor} [${data.tag}] [b]Passe registrado:[/b] ${data.passe} • ${data.executivo} [[b]Passe de ${data.passe}[/b]] ${data.dataPasse} ( [b]${data.termos}[/b] ) Li e concordo com as normas do passe executivo.`, ].join("\n"), mode: "reply", tid: $('[name="tid"]:first').val(), post: 1, attach_sig: "on", }) .done(function () { alert("Postagem realizada com sucesso! Aguarde o redirecionamento para o tópico..."); location.href = "/t3269-" + location.host + "/t3269-?view=newest"; }) .fail(function () { alert("Ocorreu um erro! Tente novamente, se o problema persistir, entre em contato com um administrador do fórum."); }); }, 600); }); }); })(jQuery); </script>