Code Monkey home page Code Monkey logo

rainbow.linenumbers.js's Introduction

Rainbow.linenumbers.js

A tiny plugin for Rainbow that adds line numbers. It's around 550 bytes gzipped.

Screenshot

With

Setup

Just include the plugin and the stylesheet:

<link rel="stylesheet" href="theme.css" />
<script src="rainbow.linenumbers.js"></script>

rainbow.linenumbers.js's People

Contributors

blender3d avatar iamawong avatar mzabriskie avatar

Stargazers

 avatar  avatar KydYork avatar Florian Bär avatar Philipp Drebes avatar NACHOS avatar Wim Cranen avatar Muntazir Fadhel avatar John avatar D avatar dmaha.ahn avatar binss avatar Stephen Merth avatar nikochan avatar Antonio Fernandes avatar Renan Barreiro avatar Katie Harron avatar Richard avatar  avatar Tengu Saruta avatar Brian Fehrle avatar Rolf van de Krol avatar Pudd avatar Frank Matuse avatar Andrej Mihajlov avatar luk avatar

Watchers

luk avatar  avatar Pudd avatar James Cloos avatar D avatar John avatar

rainbow.linenumbers.js's Issues

Zero-width space characters break JS code when copied

Great extension for rainbow. Makes it really stand out. Just one real problem: The zero-width space get copied to clipboard and result in an "Illegal character" error in JavaScript. Probably other languages are concerned by this, too.

So, it would be great to find a replacement or another solution. For the time, I've replaced the ​ with an empty string. Empty lines are removed when copied to clipboard, but that better than having a broken code.

multi-line comments break with embedded languages

Hi

This addition to rainbow is great, but it's breaking multi-line comments with embedded languages.

If you use the latest version of rainbow with your script and the following code, you'll see what I mean. Typically the first line is seen as a comment. The rest just shows up as "line-code."

Example code you can try is below, and you can also check this fiddle

<pre><code data-language="html">&lt;script&gt;
/* J stuff */
jQuery(function ($) {
    $(".rump").click(function () {
        $(".underwear").toggleClass('soiled');
    });
});
&lt;/script&gt;

&lt;style&gt;
/*-------------------------------------
                  Style stuff
-------------------------------------*/
.foo { color: brown }
.bar { color: yellow }

/* blah */
.snow:before { background-color: #eee }
.snow:after { background-color: yellow }
&lt;/style&gt;

&lt;?php
/*
PHP Comment
*/
function test_function() { // blah
    if ( $x == $y ) {
        do('something');
    }
    else {
        do('something_else');
    }
}
?&gt;</code></pre>

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.