x
SuperUp, do que estás a espera?
Entra ou Regista-te no fórum para visualizar todo conteúdo.
Top Membros do Mês
Últimos assuntos
Algum administrador?
por poison Seg 26 Jun - 20:30

Cria a tua Musica
por MIRISHIA Sex 11 Set - 13:41

[Suporte][HTML] Teste titulo
por JUFASA Qua 9 Set - 16:42

[Naruto] Jogo para Telemóvel
por MIRISHIA Seg 31 Ago - 19:02

[Dicas] Tutorial HTML
por IsmaelS. Qua 26 Ago - 23:01

[Anime] Ansatsu Kyoushitsu
por MIRISHIA Seg 24 Ago - 17:53

[Manga] Naruto Gaiden
por MIRISHIA Seg 24 Ago - 17:31

Boruto- Novo Filme de Naruto
por Je4n Seg 24 Ago - 4:05

[Tutorial] Rank PhotoShop
por StaaL Seg 3 Nov - 23:07

[Noticia] Designer
por StaaL Seg 3 Nov - 22:13

Pedido - Banner's
por JUFASA Dom 20 Jul - 22:27

Pedido - Logotipo
por IsmaelS. Dom 20 Jul - 18:03

Um jogo bom para PS2?
por JQuery Qui 17 Jul - 21:15

[CSS] CSS Transforms
por JQuery Qui 17 Jul - 21:13

[Youtube] TheKingMoreira
por JQuery Qui 17 Jul - 20:59

[Tutorial] Assault
por JQuery Qui 17 Jul - 20:53

Copyright © 2015 - UPFórum

Top Membros do Mês
Últimos assuntos
Algum administrador?
por poison Seg 26 Jun - 20:30

Cria a tua Musica
por MIRISHIA Sex 11 Set - 13:41

[Suporte][HTML] Teste titulo
por JUFASA Qua 9 Set - 16:42

[Naruto] Jogo para Telemóvel
por MIRISHIA Seg 31 Ago - 19:02

[Dicas] Tutorial HTML
por IsmaelS. Qua 26 Ago - 23:01

[Anime] Ansatsu Kyoushitsu
por MIRISHIA Seg 24 Ago - 17:53

[Manga] Naruto Gaiden
por MIRISHIA Seg 24 Ago - 17:31

Boruto- Novo Filme de Naruto
por Je4n Seg 24 Ago - 4:05

[Tutorial] Rank PhotoShop
por StaaL Seg 3 Nov - 23:07

[Noticia] Designer
por StaaL Seg 3 Nov - 22:13

Pedido - Banner's
por JUFASA Dom 20 Jul - 22:27

Pedido - Logotipo
por IsmaelS. Dom 20 Jul - 18:03

Um jogo bom para PS2?
por JQuery Qui 17 Jul - 21:15

[CSS] CSS Transforms
por JQuery Qui 17 Jul - 21:13

[Youtube] TheKingMoreira
por JQuery Qui 17 Jul - 20:59

[Tutorial] Assault
por JQuery Qui 17 Jul - 20:53


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

[Suporte] Codebox e Spoiler


avatar

#1
Desconectado
em Ter 8 Jul - 16:34

Minha questão:
Olá,

Desejava saber se era possível ter a .CSS da tabela "CODE e SPOILER", queria o "CODE" também com contador de linhas se possível.



Endereço do meu fórum:

http://master-publicitario.forumeiros.com/forum

Versão:

PunBB



Última edição por IsmaelS. em Ter 8 Jul - 17:53, editado 1 vez(es)
Ver perfil do usuário
avatar

#2
Desconectado
em Ter 8 Jul - 16:44

Cópias não são legais, mas eu poderia lhe passar um syntaxhighlight, ele contém contador de linhas e cores de acordo com a syntax!

Ver perfil do usuário
avatar

#3
Desconectado
em Ter 8 Jul - 16:57

Olá,

Não quero igual queria principalmente o CODE com contador de linhas, como o da FdF, e o SPOILER queria algo como o daqui se possível...

Ver perfil do usuário
avatar

#4
Desconectado
em Ter 8 Jul - 17:24

Alerta: Pedimos que coloque um titulo adequado, caso contrario o tópico será movido para a lixeira.

Ver perfil do usuário
avatar

#5
Desconectado
em Ter 8 Jul - 17:53

Olá,

Já coloquei, mas eu tinha colocado o problema é do seu formulário que apenas coloca a tag "SUPORTE".

Ver perfil do usuário
avatar

#6
Desconectado
em Ter 8 Jul - 19:58

Sim, mas mas precisamos da permissão do JUFASA para colocar o spoiler.

Ver perfil do usuário
avatar

#7
Desconectado
em Ter 8 Jul - 20:22

Espero que tenha noção que está a pedir muitos códigos que o up contem inseridos...

CSS:
Código:

/*NOS TOPICOS-POST*/
dl.codebox code {
background-color: #fcfcfc!important;
border: none!important;
padding: 0!important;}
blockquote {
background-color: #fcfcfc !important;
padding: 8px;
border: 1px solid #e3e3e3;
overflow: auto;
line-height: 170%;
max-height: 200px;
}
.codebox dd.cont_code {
max-height: 315px!important;
padding: 0px;}
.codebox {
background-color: #fcfcfc !important;
border: 1px solid #e3e3e3;
overflow: auto;}
.codebox dd{background-color: #fcfcfc!important;}
.codebox dt {
font-size: 12px;
padding: 8px 10px;
border-bottom: 1px solid #e3e3e3;
background: #f2f2f2 url('http://i.imgur.com/haNJ0ol.png') repeat-x 0 0;
color: #535353;
text-shadow: rgba(255,255,255,1) 0px 1px 0px;
font-weight: bold;
}

att Jufasa'

Ver perfil do usuário
avatar

#8
Desconectado
em Ter 8 Jul - 20:35

Olá,

Como se coloca o contador de linhas? Como a FdF tem também? Na codebox.

Ver perfil do usuário
avatar

#9
Desconectado
em Ter 8 Jul - 21:16

Cole este CSS no seu fórum:

Código:
/*CODIGOS EXTRAS* TOPICOS */
panda-code{
background-color: #fcfcfc!important;
border: none!important;
padding: 0!important;}
blockquote {
background-color: #fcfcfc !important;
padding: 8px;
border: 1px solid #e3e3e3;
overflow: auto;
line-height: 170%;
max-height: 200px;
}
/*Panda CSS*/
.codebox dd.cont_code {
height: auto !important;
max-height: 300px !important;   
overflow: auto;
}
/*
* Panda CSS. CSS for Panda Syntax Highlighter, all languages and all themes.
* Copyright (C) AvacWeb.com. All Rights Reserved. No distribution without consent.
* No use without this entire copyright notice in place.
*/
.panda-theme-select {
    float: right;
    margin: 2px 5px;
    display:none;
}
/* Default Theme */
.panda-code, dl.codebox code {
   padding: 5px 20px;
   font-size: 0.9em;
   font-family: monospace;
   background: #EFEFEF;
   color: #0D700D;
   border: 1px solid #CCC;
   overflow: auto;
   max-height: 200px;
   text-shadow: 0 1px white;
   text-align: left;
   display: block;
}
.panda-code ol { padding-left: 15px; }
.panda-code ol li {
    padding: 1px 10px;
    margin: 4px 0;
    border-left: 2px solid green;
    list-style-type: decimal-leading-zero;
}
.panda-code ol li:hover { background: #F5EFEF; }
.panda-string, .panda-multiLineString { color: #C03; } /* string literals */
.panda-special { color: #09F; } /* words defined as special */
.panda-keyword, .panda-extra { color: #009; } /* keywords. .panda-extra = square braces, parentheses and curly braces. */
.panda-int { color: #f00; } /* integers. */
.panda-operators { font-weight: bold; color : #000; } /* > < & = == === !== != ! && * % + / || */
.panda-comment1, .panda-comment2, .panda-comment3 { color: #666!important; font-style: italic; } /* comments */
.panda-regexp { color: #F802F8; } /* regular expressions like: /regexp/ */
.panda-JSglobal { color: #81203B; font-weight: bold; font-size: 1.1em; } /* colors the words: window, document, navigator and screen */
.panda-selector { color: #FF00F5; } /* selector section */
.panda-cssproperty { color : #105289; } /* property name */
.panda-cssunit { color: #F802F8; } /* CSS units. 1px 1.2em etc */
.panda-important { color: #f00; } /* !important declaration */
.panda-selector-pseudo { color: #D36CD3; font-style: italic;  } /* Pseudo selectors */
.panda-htmltag { color : #0E66D6; } /* HTML tag */
.panda-xmlcomment { color : #666; } /* XML comment:  */
.panda-htmltag-special { color : #A333D8; } /* a, script, body, head, html, meta, link tags. */
.panda-htmltag-attribute { color : blue; } /* attribute value */
/* Panda Syntax Highlighter - https://github.com/AvacWeb/Panda */
.panda-code {
   padding: 5px 10px;
   font-size: 1.2em;
   font-family: monospace;
   background: #EFEFEF;
   color: #0D700D;
   border: 1px solid #CCC;
   overflow: auto;
   max-height: 300px;
   text-shadow: 0 1px white;
   text-align: left;
   display: block;
}
.panda-code ol { padding-left: 15px; }
.panda-code ol li {
    padding: 1px 10px;
    margin: 4px 0;
    border-left: 2px solid green;
    list-style-type: decimal-leading-zero;
}
.panda-code ol li:hover { background: #DEDEDE; }

.panda-string, .panda-multiLineString { color: #C03; } /* string literals */
.panda-special { color: #09F; } /* words defined as special */
.panda-keyword, .panda-extra { color: #009; } /* keywords. .panda-extra = square braces, parentheses and curly braces. */
.panda-operators { font-weight: bold; color : #000; } /* > < & = == === !== != ! && * % + / || */
.panda-comment1, .panda-comment2, .panda-comment3 { color: #666!important; font-style: italic; } /* comments */
.panda-int { color: #f00; }

E crie novo Javascript:

Código:
/**
 * Panda.js
 * Extendable Client side syntax highlighter core javascript and API. No languages included.
 *
 * Copyright 2011-2012 AvacWeb (avacweb.com)
 * Released under the MIT and GPL Licenses.
 */
 (function(){function p(b,a){return a?b.replace(/\r?\n/g,"<br/>"):b.replace(/\<br\s?\/?\>/gi,"\n")}function l(b,a){return'<span clapanda="'+b+'">'+a+"</span>"}function q(b,a,c){return b.replace(RegExp("\\b(?:"+a.join("|")+")\\b","g"),function(a){return l(c,a)})}function t(b,a,c){for(var d in a)c=c.replace(a[d],function(a){return l(b+"-"+d,a)});return c}var d={cacheIdentity:!0,installedLanguages:[],languages:{},regex:{comment1:/\/\/[^\n]*/g,comment2:/\/\*(.|[\n\r])*?\*\//gm,comment3:/#[^\n]*/g,string:/(['"])(?:\\?.)*?\1/g,
operators:/[!=\+%\*\-][!=\+\-]?|&(?:amp;){2}|>|<|(?:\|\|)/g,extra:/[:\{\}\[\]\(\)]/g},parse:function(b,a){var c=d.languages[b];if(!c)return a;var e=c.matchers,g=c.keywords,r=c.specials,u=(new Date).getTime(),s={};a=p(a).replace(/\</g,"<").replace(/>/g,">").replace(/ /g," ");for(var k=0,v=0,f;f=e[k++];){var h=this.regex[f],w="\u00a3panda_"+f+"_"+u+"_",x=s[f]={},n=!1;h&&(h.inner&&(n=h.inner,h=h.outer),a=a.replace(h,function(a){var b=w+v++ +"_"+(h.multiline?"m_":"")+"panda\u00a3";n&&
(a=t("panda-"+f,n,a));x[b]=a;return b}))}g.length&&(a=q(a,g,"panda-keyword"));r.length&&(a=q(a,r,"panda-special"));c.noints||(a=a.replace(/\b\d+(?:\.\d+)?\b/g,function(a){return l("panda-int",a)}));for(k=e.length;k;k--){f=e[k-1];var c=s[f],m;for(m in c)g=c[m],m.indexOf("_m_")&&(g=g.replace(/\n/g,'</span>\n<span clapanda="panda-'+f+'">')),a=a.replace(m,l("panda-"+f,g))}a=a.split(" ").join(" ").replace(/ clapanda=/g," class=").replace(/\t/g,"   &nbsp;");return p('<ol><li class="panda-line">'+
a.split(/\n/).join('</li><li class="panda-line">')+"</li></ol>",1)},identify:function(b){if(b.pandaType)return b.pandaType;var a=/(?:\s|^)panda[_-](\w+)(?:\s|$)/;return a.test(b.className)?a.exec(b.className)[1]:"default"},colorNode:function(b){var a=d.identify(b);d.cacheIdentity&&(b.pandaType=a);b.className+=" panda-code panda-"+a;b.innerHTML=d.parse(a,b.innerHTML)},addSpecials:function(b,a){this.addKeywords(b,a,!0)},addKeywords:function(b,a,c){if(b in d)for(var e=0,g=a.length;e<g;e++)d.languages[b][c?
"specials":"keywords"].push(a[e])},addLang:function(b,a){if("matchers"in a){var c=d.languages[b]={};d.installedLanguages.push(b);c.matchers="string"==typeof a.matchers?a.matchers.split(" "):a.matchers;c.specials=("string"==typeof a.specials?a.specials.split(" "):a.specials)||[];c.keywords=("string"==typeof a.keywords?a.keywords.split(" "):a.keywords)||[];if(a.regex&&"object"==typeof a.regex)for(var e in a.regex)d.regex[e]=a.regex[e]}}};window.panda=d;d.addLang("default",{matchers:["string"],keywords:"var for while if else elseif function def class try catch return true false continue break case default delete switch in as null typeof sizeof null int char bool boolean long double float enum import struct signed unsigned",
specials:["document"]});d.onload=function(){for(var b=document.getElementsByTagName("code"),a=0,c;c=b[a++];)d.colorNode(c)}})();
panda.onload = function() {
    ('Panda Modification for Theme Changer by Avacweb. Copyright 2013 (c) All Rights Reserved. No distribution without consent. No use without this entire copyright notice in place.');
    var themes = ['default', 'dark', 'deepsea', 'bright', 'neon', 'desert', 'plain', 'geany', 'github']
    , codes = document.getElementsByTagName('code')
    , curTheme = my_getcookie('panda-theme')
    , themeHTML = '<option value="null"> -------------- </option>';
    for(var i = 0, t; (t = themes[i++]); ) {
        themeHTML += '<option value="' + t + '" ' + (curTheme && curTheme == t ? ' selected="selected"' : '') + '>';
        themeHTML += t.charAt(0).toUpperCase() + t.substr(1) + '</option>';
    }
    for(var j = 0, c; (c = codes[ j++ ]); ) {
        panda.colorNode( c );
        $(c.parentNode.parentNode).prepend('<span style="color:white;" class="panda-theme-select">Selecionar tema: <select onchange="set_panda_theme(this.value)">' + themeHTML + '</select></span>');
    };
    if(curTheme) set_panda_theme(curTheme, codes);
};
function set_panda_theme(theme, codes) {
    codes = codes || document.getElementsByTagName('code');
    for(var j = 0, c; (c = codes[ j++ ]); ) {
        c.className = c.className.replace(/\s?panda-theme-\w+\s?/, '') + ' panda-theme-' + theme;
    }
    my_setcookie('panda-theme', theme, 1);
};
$(panda.onload);

Esse é o que o upforum utiliza.

att Jufasa'

Ver perfil do usuário
avatar

#10
Desconectado
em Qua 9 Jul - 2:32

Olá,

Perfeito, resolvido!

Ver perfil do usuário
avatar

#11
Desconectado
em Qua 9 Jul - 3:26

Tópico movido para 'Arquivo: Questões Resolvidas'

Ver perfil do usuário

#12
Desconectado
Conteúdo patrocinado

Mensagem [Página 1 de 1]


Post relacionados