Hexo-theme-next: How to disable selection for Dollar signs in Markdown code blocks

Created on 21 Oct 2018  ·  10Comments  ·  Source: theme-next/hexo-theme-next

I agree and want to create new issue


Actual behavior

In common, if you select all in the code block, the $ will be included.

screen shot 2018-10-21 at 1 25 09 pm

Expected behavior

screen shot 2018-10-21 at 1 24 22 pm

demo link: https://almostover.ru/2016-10/centos-ftp-server-install/

How can I get the style like @ivan-nginx?

CSS Feature Request Solved

Most helpful comment

Yes, it's need to do in Hexo javascript file + NexT css files. I actually don't remember what i edit for that, but i can find it and want to try implement this feature in NexT or in Hexo with option on it.

Feature look's like this:

In MD file:

    yum install vsftpd

Will automatically render in HTML to:

screen shot 2018-10-21 at 1 24 22 pm

All 10 comments

Add the following css might work:

pre .bash_symbol {
  user-select: none;
  -webkit-user-select: none;    
  -moz-user-select: none;
  -ms-user-select: none;
}

thanks. Actually, css is not the key point.
The main issue might be the code block render.

In ivan's pages

<code class="bash">
  <span class="bash_symbol">$ </span>
  <span class="built_in">yum</span>
   install vsftpd
</code>

default render

The default render is tomorrow-theme

# Code Highlight theme
# https://github.com/chriskempson/tomorrow-theme
highlight_theme: normal

In the default render, I get the following output

<td class="code">
  <pre>
    <span class="line">
      $ hexo new 
      <span class="string">"My New Post"</span>
    </span>
  </pre>
</td>

Yes, it's need to do in Hexo javascript file + NexT css files. I actually don't remember what i edit for that, but i can find it and want to try implement this feature in NexT or in Hexo with option on it.

Feature look's like this:

In MD file:

    yum install vsftpd

Will automatically render in HTML to:

screen shot 2018-10-21 at 1 24 22 pm

Thanks

Try this:

$(".line").each(function(i, o) {
    str = $(o).html();
    if (str.substring(0, 2) == "$ ") {
        $(o).html('<span style="user-select: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;">$ </span>' + str.substring(2));
    }
});

This issue has been automatically marked as stale because lack of recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

@stevenjoezhang there is not only in Hexo need to be added. Some CSS need to add too. For now no need to think about this feature, I'll think about this later.

https://github.com/highlightjs/highlight.js/issues/1486

@xu-song @ivan-nginx Use shell instead of bash, sh or zsh

Reverted in next-theme/hexo-theme-next@9fdaba2

@maple3142 Thanks. Your comment there in https://github.com/theme-next/hexo-theme-next/issues/448#issuecomment-431677117 helped me a lot, even though I have no clue what the hexo-theme-next is all about. :joy: :+1:

Was this page helpful?
0 / 5 - 0 ratings

Related issues

leeyongda picture leeyongda  ·  3Comments

dslztx picture dslztx  ·  7Comments

codenoobforreal picture codenoobforreal  ·  3Comments

Linters picture Linters  ·  3Comments

ivan-nginx picture ivan-nginx  ·  5Comments