Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Content is only shown in one column #598

Closed
TheZoker opened this issue Jun 18, 2015 · 9 comments
Closed

Content is only shown in one column #598

TheZoker opened this issue Jun 18, 2015 · 9 comments

Comments

@TheZoker
Copy link

Here is the code I tested:

<!DOCTYPE html>
<html lang="en">
<head>

<script>
    // Just a lil’ script to show off that inline JS gets highlighted
    window.console && console.log('foo');
</script>
<meta charset="utf-8" />
<link rel="shortcut icon" href="favicon.png" />
<title>Prism</title>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="themes/prism.css" data-noprefix />
<script src="prefixfree.min.js"></script>

<script>var _gaq = [['_setAccount', 'UA-33746269-1'], ['_trackPageview']];</script>
<script src="http://www.google-analytics.com/ga.js" async></script>
</head>
<body>

And here is the output:
img_2015 06 18_22h10m37s_004_

@Golmote
Copy link
Contributor

Golmote commented Jun 18, 2015

Thanks for reporting.
Could you provide an online page reproducing the problem?

@loganfranken
Copy link
Contributor

Hey @TheZoker, I think your new lines might be getting stripped.

If you look at the source code (view-source:http://demo.comboot.io/viewtopic.php?style=2&f=2&t=7&p=66#p66) from the original issue you reported:

<div class="content">
                            <dl class="codebox"><dt>Code: <a href="#" onclick="selectCode(this); return false;">Select all</a></dt><dd><pre class="line-numbers"><code class="language-markup">&lt;?php <br />&nbsp;Print &quot;Hello, World!&quot;;<br />&nbsp;?&gt; <br /><br />&nbsp;&lt;?php <br />&nbsp;Echo &quot;Hello, World!&quot;;<br />&nbsp;?&gt;<br /></code></pre></dd></dl>
                        </div>

It looks like it's all in one line in the markup, so Prism will display it in kind.

Let me know if I'm off base, though!

@Golmote
Copy link
Contributor

Golmote commented Jun 18, 2015

Oh, sorry I didn't see the other issue on the other repo.
It looks like your line feeds are replaced with <br /> tags, which are stripped during highlighing (like any other HTML tags in the code block).

@Golmote
Copy link
Contributor

Golmote commented Jun 19, 2015

I think you might fix your issue with a little hook like the following (to be inserted after Prism main script):

Prism.hooks.add('before-highlight', function(env) {
    env.element.innerHTML = env.element.innerHTML.replace(/<br\s*\/?>/g,'\n');
    env.code = env.element.textContent.replace(/^(?:\r?\n|\r)/,'');
});

@LeaVerou Should we handle this in the official release?

@TheZoker
Copy link
Author

Hi, thanks for the fast answer :)
Just included the code, but now its totaly messed :P
http://demo.comboot.io/viewtopic.php?style=2&f=2&t=34
http://demo.comboot.io/viewtopic.php?style=2&f=2&t=7&p=66#p66 (code completly missing)

@Golmote
Copy link
Contributor

Golmote commented Jun 23, 2015

The version of Prism you're using seems quite outdated. Have you tried to redownload it from http://prismjs.com/download.html?themes=prism&languages=markup+css+clike+javascript&plugins=line-numbers+autolinker ?

@TheZoker
Copy link
Author

I re-downloaded it and same issue :/

@Golmote
Copy link
Contributor

Golmote commented Jun 23, 2015

Be sure to empty your browser cache. I can no longer reproduce the issue on the two links you posted previously:

http://demo.comboot.io/viewtopic.php?style=2&f=2&t=34

http://demo.comboot.io/viewtopic.php?style=2&f=2&t=7&p=66#p66

@TheZoker
Copy link
Author

Your right, was cached in my browser :)
Thank you very much!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants