Transformação de códigos AwesomeBB Para ModernBB Hitskin_logo Hitskin.com

Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o temaVoltar para a ficha do tema

Transformação de códigos AwesomeBB Para ModernBB

3 participantes

Ir para baixo

Tópico resolvido Transformação de códigos AwesomeBB Para ModernBB

Mensagem por PauloVinicios1755 18.06.21 2:39

Detalhes da questão


Endereço do fórum: http://redeobscure.forumeiros.com
Versão do fórum: ModernBB

Descrição


1 Código -  Ultimos assuntos
Código:
/**
 *  Últimos assuntos - AwesomeBB by Pedxz
 *  Created August 26, 2018 <UP_22.04.2020>
 *  See more: http://ajuda.forumeiros.com
 */
(function($, CSS) {
    'use strict';
 
    var config = {
        title: 'Tópicos Recentes',
        loading: 'Carregado',
        empty: 'No momento estamos sem tópicos para poderes ver ou não têm permissão para vê-los!',
        icon: 'chat',
    };
 
    $(function() {
 
        if (_board.tpl_version !== 'awesomebb') return;
        if (!config.title || !config.loading || !config.icon || !config.empty) return;
 
        $('<div>', {
            id: 'block-latest',
            class: 'block'
        }).html([
            ' <div class="box-head">',
            ' <i class="material-icons">' + config.icon + '</i>',
            ' <span>' + config.title + '</span>',
            ' </div>',
            ' <div class="box-body">',
            ' <div class="block-last-load">' + config.loading + '</div>',
            ' </div>'
        ].join('\n')).insertBefore('#index');
 
 
        $('#block-latest .block-last-load')
            .load('/latest .block-topics-details');
 
 
        $('<style>')
            .text('.block-last-load:empty::before { content: "'+ config.empty +'";}' + CSS.join('\n'))
            .appendTo('head');
 
    });
}(jQuery, [
    '.block-last-load {' +
    ' margin-left: -.37em;',
    ' margin-right: -.37em;',
    ' height: 300px;',
    ' overflow-y: auto;',
    '}',
    '',
    '.block-last-load a {',
    '  text-decoration: none;',
    '  border: 0!important;',
    '  display: inline;',
    '}',
    '',
    '.block-last-load .block-topics-details {',
    ' padding: 1em;',
    '}',
    '',
    '.block-last-load .block-topics-details:not(:nth-child(2n+1)) {',
    ' background-color: #2c3e50;',
    '}',
    '',
    '#block-latest h2 {',
    ' font-size: 16px;',
    ' text-overflow: ellipsis;',
    ' overflow: hidden;',
    ' white-space: nowrap;',
    ' width: 100%;',
    '}',
    '',
    '#block-latest .block-topics-author,',
    '#block-latest .block-topics-lastpost img {',
    '  display: none;',
    '}',
    '',
    '#block-latest .block-topics-lastpost,',
    '#block-latest .block-topics-author a {',
    '  display: inline;',
    '}',
    '',
    '.block-marquee {',
    '  overflow: hidden;',
    '}',
    '',
    '@media only screen and (max-width: 768px) {',
    ' #block-latest {',
    '  margin-top: 20px;',
    ' }',
    '}',
    ''
]));

2 Código -  Borda avatar
Código:
$(function() {
    $('.post-aside').each(function() {
        var $this = $(this),
            cor = $this.find('.post-author-name span').css('color');
        $this.css('border-right', '7px solid').css('border-color', cor)
    })
});

3 Código - Login
Código:
(function($) {
            'use strict';
            $(function() {
                if (_userdata.session_logged_in === 1) {
                    return;
                }
                if (!((/^\/login/i.test(location.pathname)))) {
                    return;
                }
      
      
                $('header').css({
                    'display': 'none'
                });
      
          
                $(".panel fieldset").attr("style", "margin: 0!important");
                $("dd:last-child").attr("style", "text-align: right");
                $(".content").attr("style", "display: none");
                $(".panel").attr("style", "background-color: inherit; box-shadow: none");
                $(".h3").attr("style", "border: 0; font-size: 32px; font-weight: 500; margin-bottom: 20px;");
                $("input[type='text']").attr("style", "width: 100%!important; border: 1px solid #ced4da; border-radius: 5px; padding: 6px 12px; font-size: 16px;");
                $(".button1").attr("style", "text-transform: uppercase; font-size: 20px; width: 100%!important; margin: 8px 0 0;");
                $("#wrap").attr("style", "background-color: #fff; margin-top: 64px;");
                $("dd").attr("style", "margin-left: 0!important; text-align: right;");
                $("label").attr("style", "margin-right: 0!important;");
                $("dl:nth-child(3)").attr("style", "padding: 0;");
                $(".conteneur_minwidth_IE").attr("style", "flex: inherit");
                $(".page-title").attr("style", "color: #444; border: 0; font-size: 32px; font-weight: 500; padding: 0");
                $(".inner p").attr("style", "width: 105%;");
                $("body").attr("style", "background-color: #fff; align-items: center; justify-content: center; display: flex;");
                $("#username").attr("placeholder", "Nome de usuário");
                $("#password").attr("placeholder", "Senha");
                $(".button1").attr("value", "Entrar");
                $(".h3").text("Iniciar sessão");
                $('.page-header').css('text-align', 'center');
                $('.page-header h2').replaceWith('<img src="https://2img.net/i.imgur.com/DxsSFEe.png" alt="Brasil Play Obscure" width="150">');
      
                $('#wrap').css({
                    'background-image': 'url(https://i.imgur.com/5WyZt2Q.png)',
                    'position': 'fixed',
                    'top': 0,
                    'left': 0,
                    'display': 'block',
                    'max-width': '100%',
                    'z-index': '999999',
                    'right': 0,
                    'min-width': '100%',
                    'overflow': 'hidden',
                    'bottom': 0,
                    'margin-top': 0
                });
      
                var $password = $('#password');
                $password.attr("style", "width: 100%!important; border: 1px solid #ced4da; border-radius: 5px; padding: 6px 12px; font-size: 16px; margin-bottom: 8px;");
                var $panel1 = $('form .panel');
                $panel1.attr("style", "background-color: #fff; box-shadow: 0 1rem 3rem rgba(0,0,0,.175)!important; padding: 32px; width: 366px; margin: auto; display:block!important");
                var $content = $('form .content');
                $content.attr("style", "display: block!important");
                var $register = $('form .panel .inner .content .fields1');
                $register.append('<a href="/register"><div style="font-size: 20px; align-items: center; justify-content: center; display: flex; padding: 10px 24px; text-transform: uppercase;"><i class="fa fa-user" style="margin-right: 8px"></i>Registrar</div></a>');
                var $footer = $('.conteneur_minwidth_IE');
                $footer.append('<div style="text-align: center; font-size: 16px; color: #6c757d;"><p style="margin: 0 0 6px; font-size: 14px">Feito <i class="fas fa-code"></i> por <a href="https://ajuda.forumeiros.com/u64319">vcapelli</a> para <a href="https://forumeiros.com/">Forumeiros.com</a></p><div class="footer-link"><a href="/forum">Início</a><a href="/faq">FAQ</a><a href="/privacy">Política de Privacidade</a></div>');
                $footer.append('<img style="position: absolute; top: calc(20% - 44.50px - 44.50px); left: 50%; transform: translate(-50%, 0);" src="https://2img.net/r/frmste/images/sigle.png"/>');
                var $footercss = $('.footer-link a');
                $footercss.attr("style", "margin: 0 6px;");
                var $awesome = $('head');
                $awesome.append('<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.10.2/css/all.css">');
            });
        })(jQuery);

queria fazer funcionar esses códigos no tema do meu fórum
PauloVinicios1755
PauloVinicios1755
****

Membro desde : 04/04/2021
Mensagens : 237
Pontos : 345

https://brasilplayobscure.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por tikky 18.06.21 20:59

Olá @PauloVinicios1755,

1 Código -  Ultimos assuntos
O primeiro código cria um widget dos "Últimos assuntos" é possível inserir sem esse script.


2 Código - Borda avatar
Código:
$(function() {
    $('.post').each(function() {
        var $this = $(this),
            cor = $this.find('.postprofile-name span').css('color');
        $this.css('border-right', '7px solid').css('border-color', cor)
    })
});


3 Código - Login
Basta usar o código base sem edições: https://ajuda.forumeiros.com/t116219-plugin-mudar-pagina-de-login


Atenciosamente,
pedxz.
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por PauloVinicios1755 19.06.21 13:20

sem sucesso! Triste
PauloVinicios1755
PauloVinicios1755
****

Membro desde : 04/04/2021
Mensagens : 237
Pontos : 345

https://brasilplayobscure.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por tikky 20.06.21 14:14

PauloVinicios1755 escreveu:sem sucesso! Triste
O gerenciamento de códigos JavaScript está desativado no seu fórum:

Transformação de códigos AwesomeBB Para ModernBB J171hVo
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por PauloVinicios1755 25.06.21 13:49

opa desculpa a demora tava doente, mais o código funcionou mas não era assim que eu queria, quero igual a esse fórum: brasilplayobscure.forumeiros.com
PauloVinicios1755
PauloVinicios1755
****

Membro desde : 04/04/2021
Mensagens : 237
Pontos : 345

https://brasilplayobscure.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por Lobs 25.06.21 16:05

PauloVinicios1755 escreveu:opa desculpa a demora tava doente, mais o código funcionou mas não era assim que eu queria, quero igual a esse fórum: brasilplayobscure.forumeiros.com

Olá @PauloVinicios1755. Tudo bem?

Poderia deixar o código ativo no seu fórum para eu ver como ele está agindo?
Lobs
Lobs
****

Membro desde : 02/06/2013
Mensagens : 323
Pontos : 378

https://www.forumnsanimes.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por PauloVinicios1755 25.06.21 19:36

PauloVinicios1755
PauloVinicios1755
****

Membro desde : 04/04/2021
Mensagens : 237
Pontos : 345

https://brasilplayobscure.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por Lobs 25.06.21 21:03


Olá @PauloVinicios1755

Não entendi o significado da sua mensagem.

Ative o código da página de login no seu fórum, por favor.
Lobs
Lobs
****

Membro desde : 02/06/2013
Mensagens : 323
Pontos : 378

https://www.forumnsanimes.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por PauloVinicios1755 26.06.21 5:28

https://i.imgur.com/PU5OoKF.png está assim eu quero que a borda laranja fique no lado esquerdo
PauloVinicios1755
PauloVinicios1755
****

Membro desde : 04/04/2021
Mensagens : 237
Pontos : 345

https://brasilplayobscure.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por tikky 26.06.21 11:27

PauloVinicios1755 escreveu:não era assim que eu queria
Exatamente por isso que existe o campo "Descrição" no formulário de suporte para não haver margem de dúvida na questão acelerando assim a resolução da mesma. Altere o seu código para:
Código:
(function($) {  
  'use strict';
  
  $(function() {
  
    $('.post').each(function() {
        var $post = $(this);
        var color = $post.find('.postprofile-name span').css('color');
      
      if(!color.length) return;
            
        $post
          .find('.postprofile')
          .css({
            'border-right': '7px solid',
            'border-color': color
          });
    });
  
  });
})(jQuery);
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por PauloVinicios1755 26.06.21 14:37

ótimo agradeço desde já, mas ficou muito proximo do titulo do fórum, outra coisa teria como remover a listra roxa só da parte antes do código?
PauloVinicios1755
PauloVinicios1755
****

Membro desde : 04/04/2021
Mensagens : 237
Pontos : 345

https://brasilplayobscure.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por tikky 27.06.21 14:45

PauloVinicios1755 escreveu:ótimo agradeço desde já, mas ficou muito proximo do titulo do fórum
Altere o código para:
Código:
        (function($) { 
          'use strict';
         
          $(function() {
         
            $('.post').each(function() {
                var $post = $(this);
                var color = $post.find('.postprofile-name span').css('color');
             
              if(!color.length) return;
                   
                $post
                  .find('.postprofile > dl')
                  .css({
                    'border-right': '7px solid',
                    'border-color': color
                  });
            });
         
          });
        })(jQuery);

remover a listra roxa só da parte antes do código?
Adicione na sua folha de estilo o seguinte código:
Código:
.post-head {
    border-width: 0 !important;
}
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por PauloVinicios1755 27.06.21 15:44

desculpe mais foi falta de esclarecimento meu, oq acontece a borda ficou muito próximo da placa do rank, tirei coo por 2 espaço para direita segue a print de como quero que fique; https://i.imgur.com/oX23gEy.png

como pode ver eu dei um espaçamento, fora que a listra roxa permaneceu mais só depois da borda eu coloquei um brilho na borda, e se puder colocar uma animação na bordar ficaria top, exemplo seria como  o nick que está no meu fórum, está um animação com o nick brilhante tem como
PauloVinicios1755
PauloVinicios1755
****

Membro desde : 04/04/2021
Mensagens : 237
Pontos : 345

https://brasilplayobscure.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por tikky 27.06.21 16:17

PauloVinicios1755 escreveu:como pode ver eu dei um espaçamento, fora que a listra roxa permaneceu mais só depois da borda eu coloquei um brilho na borda, e se puder colocar uma animação na bordar ficaria top, exemplo seria como  o nick que está no meu fórum, está um animação com o nick brilhante tem como
Como é complicado adicionar brilho na esquerda, eis a minha sugestão:
Código:
(function($) {
    'use strict';

    $(function() {

        $('.post').each(function() {
            var $post = $(this);
            var color = $post.find('.postprofile-name span').css('color');

            if (!color.length) return;

            $post
                .find('.postprofile')
                .css({
                    'transition': 'all 0.6s linear',
                    'border-top': '2px solid ' + color,
                    '-webkit-box-shadow': 'inset 0 20px 20px -20px ' + color,
                    '-moz-box-shadow': 'inset 0 20px 20px -20px ' + color,
                    'box-shadow': 'inset 0 20px 20px -20px ' + color
                })
                .end()
                .find('.postprofile-name span')
                .css('text-shadow', '2px 0 11px ' + color);
        });

    });
})(jQuery);
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por PauloVinicios1755 27.06.21 16:30

perfeito <3, mais teria como a borda ver ir até o final?
PauloVinicios1755
PauloVinicios1755
****

Membro desde : 04/04/2021
Mensagens : 237
Pontos : 345

https://brasilplayobscure.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por tikky 27.06.21 16:44

PauloVinicios1755 escreveu:borda ver ir até o final
Código:
(function($) {
    'use strict';
 
    $(function() {
 
        $('.post').each(function() {
            var $post = $(this);
            var color = $post.find('.postprofile-name span').css('color');
 
            if (!color.length) return;
 
            $post
                .find('.post-head')
                .css({
                    'transition': 'all 0.6s linear',
                    'border-top': '2px solid ' + color,
                    '-webkit-box-shadow': 'inset 0 20px 20px -20px ' + color,
                    '-moz-box-shadow': 'inset 0 20px 20px -20px ' + color,
                    'box-shadow': 'inset 0 20px 20px -20px ' + color
                })
                .end()
                .find('.postprofile-name span')
                .css('text-shadow', '2px 0 11px ' + color);
        });
 
    });
})(jQuery);
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por PauloVinicios1755 27.06.21 16:49

a borda roxa ficou por cima da borda do grupo
PauloVinicios1755
PauloVinicios1755
****

Membro desde : 04/04/2021
Mensagens : 237
Pontos : 345

https://brasilplayobscure.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por tikky 27.06.21 16:51

Na sua folha de estilo localize:
Código:
.post-head {
    border-color: #B009AB !important;
    background-color: #3D3C3D !important;
}
e substitua para
Código:
.post-head {
    background-color: #3D3C3D !important;
}
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por PauloVinicios1755 27.06.21 17:01

ótimo perfeito, mais a listra ficou azul
PauloVinicios1755
PauloVinicios1755
****

Membro desde : 04/04/2021
Mensagens : 237
Pontos : 345

https://brasilplayobscure.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por tikky 27.06.21 17:20

pedxz escreveu:Adicione na sua folha de estilo o seguinte código:
Código:
.post-head {
    border-width: 0 !important;
}
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por PauloVinicios1755 27.06.21 17:50

pode fechar o tópico obgd <3
PauloVinicios1755
PauloVinicios1755
****

Membro desde : 04/04/2021
Mensagens : 237
Pontos : 345

https://brasilplayobscure.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Transformação de códigos AwesomeBB Para ModernBB

Mensagem por tikky 27.06.21 17:57

Tópico resolvido


Movido para "Questões resolvidas".
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

 
Permissões neste sub-fórum
Não podes responder a tópicos