Commit 8f7c169c authored by Nikolay Gromov's avatar Nikolay Gromov

add block code

parent 53c1f980
<!--DEV
<pre class="code">
<code class="code__syntax css">
<span class="code__line">/* Родитель: */</span>
</code>
<code>/* Родитель: */</code>
</pre>
-->
This diff is collapsed.
// Для импорта в диспетчер подключений: @import './src/blocks/code/code.less';
@import '../../less/variables.less'; // только для удобства обращения к переменным
.code {
display: block;
width: 100%;
overflow-x: auto;
background-color: @gray-lightest;
padding: 1em;
border-radius: @border-radius;
border: 1px solid @gray-lighter;
white-space: normal;
tab-size: 2;
max-height: 50rem;
&__syntax {}
&__line {
display: block;
white-space: pre;
}
}
// Подсветка кода после обработки JS
.hljs {
display: block;
width: auto;
color: @text-color;
background-color: transparent;
padding: 0;
}
.hljs-comment,
.hljs-quote {
color: #999;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-subst {
color: #333;
font-weight: 700;
}
.hljs-number,
.hljs-literal,
.hljs-variable,
.hljs-template-variable,
.hljs-tag .hljs-attr {
color: #4f9fcf;
}
.hljs-string,
.hljs-doctag {
color: #d44950;
}
.hljs-title,
.hljs-section,
.hljs-selector-id {
color: #900;
font-weight: 700;
}
.hljs-subst {
font-weight: 400;
}
.hljs-type,
.hljs-class .hljs-title {
color: #458;
font-weight: 700;
}
.hljs-tag,
.hljs-name,
.hljs-attribute {
color: #2f6f9f;
font-weight: 400;
}
.hljs-regexp,
.hljs-link {
color: #009926;
}
.hljs-symbol,
.hljs-bullet {
color: #990073;
}
.hljs-built_in,
.hljs-builtin-name {
color: #0086b3;
}
.hljs-meta {
color: #999;
font-weight: 700;
}
.hljs-deletion {
background: #fdd;
}
.hljs-addition {
background: #dfd;
}
.hljs-emphasis {
font-style: italic;
}
.hljs-strong {
font-weight: 700;
}
.less {
.hljs-selector-tag {
font-weight: 400;
}
.hljs-variable {
color: #f60;
}
}
// В этом файле должны быть стили только для БЭМ-блока code, его элементов,
// модификаторов, псевдоселекторов, псевдоэлементов, @media-условий...
// Не пишите здесь другие селекторы.
.code {
display: block;
width: 100%;
overflow-x: auto;
background-color: $gray-lightest;
padding: 1em;
border-radius: $border-radius;
border: 1px solid $gray-lighter;
white-space: normal;
tab-size: 2;
max-height: 50rem;
code {
display: block;
white-space: pre;
}
}
См. [highlightjs.org/download/](https://highlightjs.org/download/)
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment