source/css/_common/components/tags/note.styl 这个 CSS 是全局 CSS，造成污染

[zhangnew]

Expected behavior (预期行为)

source/css/_common/components/tags/note.styl 这个 CSS 改成针对具体控件

Actual behavior (实际行为)

source/css/_common/components/tags/note.styl 这个 CSS 写的 note 是 全局的

Steps to reproduce the behavior (重现步骤)

无。

NexT Information

Add the ✔ sign before an item which is affected by this behavior.

NexT Version:

• Master
• Latest Release ✔ Old version - v5.1.0

NexT Scheme:

• All schemes
• Muse ✔ Mist
• Pisces

Other Information (Like Browser, System, Screenshots)

scripts/tags/note.js 这个脚本生成了 class="note" ，但是不知道这个是干嘛用的，网页上面没找到这个控件。

https://github.com/iissnan/hexo-theme-next/commit/841c03e690ba3816ecb206b64b6b042c5545fd38 提交信息为：CSS: add bs-callout notes style.

[ivan-nginx]

@zhangnew may u write in english? What is it? I don't understand.

[zhangnew]

@ivan-nginx source/css/_common/components/tags/note.styl this CSS is a global style, I think it should be wrote for a specific widget.

I have a div with this attribute class="note" ，I set a specific style for this div, but the style of this div is polluted by the /note.styl .

I want to know what the /note.styl wrote for , and why wrote it as a global variable.

[ivan-nginx]

@zhangnew > I want to know what the /note.styl wrote for , and why wrote it as a global variable. note.styl is a style for note tag. This mean if u write in .md:

{% note %}
Any text
{% endnote %}

it will be bs-callout notes style (#1160). Of course, u may set any custom div in markdown, and if it will be note, all styles will be applied for div with this name.

For the second question, i'm not profi about global or not global styles, but there is commented string and i think this is not applied for real code.

Also, if your style conflict with note tag style, u may rename:

1. Your custom div style in all .md files from note to note2 for e.x.
2. From all note to note2 in source/css/_common/components/tags/note.styl.

OR

U may rewrite note style in custom style file: /source/css/_custom/custom.styl

.note {
    padding: ... ;
    margin: ... ;
}

---

@iissnan how u think, i may add option in theme config for import this note styles or not.

note_tag: true | false

But i think this is not bug or issue.

[ivan-nginx]

@zhangnew this is solved your problem?

[zhangnew]

Thanks for your reply, and sorry about that I reply so late.

Actually, I think your note is wrote for class="post-body"( the article content ), just like

.post-body .note {
    padding: ... ;
    margin: ... ;
}

Just change all of the .note to .post-body .note in the source/css/_common/components/tags/note.styl That's why I called note is a global style.

My note class is wrote for my comments system : isso, but polluted by the global note style.

I know I can change my class name, but I think your note write for the post-body class is a good idea, then add option in theme config will be better.

[ivan-nginx]

@zhangnew ok, fixed in #1697 pull. Also, refactor styles and add some features.

If solved, close issue.

[zhangnew]

solved, thank you very much.