Page 1 of 2 12 LastLast
Results 1 to 10 of 20

Thread: Enhanced XCode Tags [Userscript]

  1. #1

    Default Enhanced XCode Tags [Userscript]

    Enhanced XCode Tags
    Improved xcode tags for the xNULL Forum

    Features
    • Better Syntax Highlighting
    • Replaced default color theme with two new color themes: Monokai Light and Monokai Dark (Sublime Text style)
    • Added a "Toggle Switch" in the upper right corner of the code block to toggle color themes (your preference is saved every time you toggle it)
    • Removed max-height limit from the code block (because it looks better)
    • Increased font size from 13px to 14px (more readable)
    • Now using the Fira Code Font (Monospaced font with programming ligatures)


    Install
    Firefox and Google Chrome:
    1. Install Tampermonkey userscript manager
    2. Click HERE to install EnhancedXcodeTags userscript


    Preview

    Github Repo: github.com/eduzappa18/EnhancedXcodeTags

  2. #2

  3. #3
    Client Beta Testers Appelpitje's Avatar
    Join Date
    Jan 2012
    Location
    Belgium
    Posts
    571

    Default

    Looking good Zappa!

  4. #4
    Administrator James's Avatar
    Join Date
    May 2010
    Location
    on the intraweb
    Posts
    3,180

    Default

    Wow! Nicely done man!

  5. #5
    Über Prodigy & Developer Razo[R]apiD's Avatar
    Join Date
    May 2010
    Location
    Poland, Lublin
    Posts
    3,257

    Default

    It's nice Maybe we could modify xcode tags directly? This way I wouldn't have to install it.

  6. #6

    Default

    sure, that would be ideal.
    I'll try to improve it even more using the latest version of prismjs and make a modified version for the forum

  7. #7

    Default

    Ok, I managed to make something that can work natively in the forum

    I edited the light theme to make it more like Notepad++, similar to the current one edited by James.
    So it's like, Light Theme = Notepad++ | Dark Theme = Sublime Text
    I also added the Line Numbers plugin and the Normalize Whitespace plugin

    Here is a live demo xNULL-xcode demo

    If you think is ok to be added to the forum, download the "xcode" folder from this repo github.com/eduzappa18/xNULL-xcode, make a backup of the the current "xcode" folder, and replace it with the new one.

    After that, the code in the <head> tag needs to be replaced (IDK if the urls has to be absolute or relative where it's edited)
    Spoiler: code

    Current xcode code in the <head> tag

    <link rel="stylesheet" href="https://x-null.net/forums/xcode/prism.css">
    <script src="https://x-null.net/forums/xcode/prism.js"></script>
    <script type="text/javascript">
    function selectElementText(el, win) {
    win = win || window;
    var doc = win.document, sel, range;
    if (win.getSelection && doc.createRange) {
    sel = win.getSelection();
    range = doc.createRange();
    range.selectNodeContents(el);
    sel.removeAllRanges();
    sel.addRange(range);
    } else if (doc.body.createTextRange) {
    range = doc.body.createTextRange();
    range.moveToElementText(el);
    range.select();
    }
    };
    $(function() {
    $('pre').on('dblclick', function(e) {
    e.preventDefault();
    selectElementText(e.currentTarget);
    });
    });
    </script>




    Replacement

    <!-- xNULL xcode-->
    <link rel="stylesheet" href="https://www.x-null.net/forums/xcode/prism-base.css"/>
    <link rel="stylesheet" href="https://www.x-null.net/forums/xcode/prism-light.css" id="light_theme" />
    <link rel="stylesheet" href="https://www.x-null.net/forums/xcode/prism-dark.css" id="dark_theme" />
    <link rel="stylesheet" href="https://www.x-null.net/forums/xcode/xcode-switch.css"/>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/tonsky/FiraCode@1.207/distr/fira_code.css">
    <script src="https://www.x-null.net/forums/xcode/prism.js"></script>
    <script src="https://www.x-null.net/forums/xcode/prism-mohaa.js"></script>
    <script src="https://www.x-null.net/forums/xcode/xcode-switch.js"></script>
    <script type="text/javascript">
    function selectElementText(el, win) {
    win = win || window;
    var doc = win.document, sel, range;
    if (win.getSelection && doc.createRange) {
    sel = win.getSelection();
    range = doc.createRange();
    range.selectNodeContents(el);
    sel.removeAllRanges();
    sel.addRange(range);
    } else if (doc.body.createTextRange) {
    range = doc.body.createTextRange();
    range.moveToElementText(el);
    range.select();
    }
    };
    $(function() {
    $('pre').on('dblclick', function(e) {
    e.preventDefault();
    selectElementText(e.currentTarget);
    });
    });
    </script>
    <!-- xNULL xcode-->


    The max-height limit is removed, so full code is shown without scroll. If you want to edit that, is the line #28 (commented) in the "xcode/prism-base.css" file
    If you think something else needs to be changed, go ahead. I just want the dark theme to be like Sublime Text

    so, @admins, What do you think?

  8. #8
    Über Prodigy & Developer Razo[R]apiD's Avatar
    Join Date
    May 2010
    Location
    Poland, Lublin
    Posts
    3,257

    Default

    Sweet I like it a lot!

  9. #9
    Developer RyBack's Avatar
    Join Date
    Apr 2014
    Location
    In Front of the screen
    Posts
    1,603

    Default

    Looks nice, zappa.
    While we're at it, can you please make double clicking inside xcode select current line only instead of the whole script? it's annoying as hell.

  10. #10

    Default

    Quote Originally Posted by RyBack View Post
    Looks nice, zappa.
    While we're at it, can you please make double clicking inside xcode select current line only instead of the whole script? it's annoying as hell.
    You can triple-click to select the current line/paragraph. not only inside xcode but in any text from any website.
    Source: Triple-click - Wikipedia

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •