mirror of
https://github.com/cypress-io/cypress.git
synced 2026-02-04 22:30:00 -06:00
Update code highlighting to be more beautiful.
This commit is contained in:
Jennifer Mann
@@ -40,9 +40,13 @@ post_asset_folder: false
|
||||
relative_link: false
|
||||
future: true
|
||||
highlight:
|
||||
enable: true
|
||||
line_number: false
|
||||
auto_detect: true
|
||||
enable: false
|
||||
|
||||
# https://github.com/ele828/hexo-prism-plugin
|
||||
prism_plugin:
|
||||
mode: 'preprocess' # realtime/preprocess
|
||||
theme: 'coy'
|
||||
line_number: false # default false
|
||||
|
||||
# Category & Tag
|
||||
default_category: uncategorized
|
||||
@@ -111,7 +115,7 @@ hfc_html:
|
||||
enable: true
|
||||
exclude:
|
||||
hfc_css:
|
||||
enable: true
|
||||
enable: false
|
||||
exclude:
|
||||
- '*.min.css'
|
||||
hfc_js:
|
||||
|
||||
@@ -44,6 +44,7 @@
|
||||
"hexo-generator-category": "^0.1.3",
|
||||
"hexo-generator-index": "^0.2.0",
|
||||
"hexo-generator-seo-friendly-sitemap": "0.0.20",
|
||||
"hexo-prism-plugin": "^2.0.2",
|
||||
"hexo-renderer-marked": "^0.2.10",
|
||||
"hexo-renderer-scss": "^1.0.2",
|
||||
"hexo-server": "^0.2.0",
|
||||
|
||||
@@ -1,171 +1,203 @@
|
||||
pre {
|
||||
font-family: $font-mono;
|
||||
color: $highlight-foreground;
|
||||
background: $highlight-background;
|
||||
font-size: 0.9em;
|
||||
padding: 1em;
|
||||
line-height: $line-height;
|
||||
|
||||
code {
|
||||
.article pre, .article code {
|
||||
&[class*="language-"] {
|
||||
font-size: 0.9em;
|
||||
line-height: $line-height;
|
||||
background-image: none;
|
||||
background-color: $highlight-background;
|
||||
color: $highlight-foreground;
|
||||
border: none;
|
||||
display: block;
|
||||
padding: 0;
|
||||
}
|
||||
box-shadow: none !important;
|
||||
|
||||
.comment { color: $highlight-comment; }
|
||||
.token {
|
||||
&.keyword, &.function {
|
||||
color: $highlight-purple;
|
||||
}
|
||||
|
||||
.variable,
|
||||
.attribute,
|
||||
.tag,
|
||||
.regexp,
|
||||
.ruby .constant,
|
||||
.xml .tag .title,
|
||||
.xml .pi,
|
||||
.xml .doctype,
|
||||
.html .doctype,
|
||||
.css .id,
|
||||
.css .class,
|
||||
.css .pseudo {
|
||||
color: $highlight-red;
|
||||
}
|
||||
&.comment {
|
||||
color: $highlight-comment;
|
||||
}
|
||||
|
||||
.number,
|
||||
.preprocessor,
|
||||
.built_in,
|
||||
.literal,
|
||||
.params,
|
||||
.constant,
|
||||
.command {
|
||||
color: $highlight-orange;
|
||||
}
|
||||
&.string {
|
||||
color: $highlight-blue;
|
||||
}
|
||||
|
||||
.ruby .class .title,
|
||||
.css .rules .attribute,
|
||||
.string,
|
||||
.value,
|
||||
.inheritance,
|
||||
.header,
|
||||
.ruby .symbol,
|
||||
.xml .cdata,
|
||||
.special,
|
||||
.number,
|
||||
.formula {
|
||||
color: $highlight-green;
|
||||
}
|
||||
&.regex {
|
||||
color: $highlight-red;
|
||||
}
|
||||
|
||||
.title,
|
||||
.css .hexcolor {
|
||||
color: $highlight-aqua;
|
||||
}
|
||||
&.keyword, .attr-value {
|
||||
color: $highlight-aqua;
|
||||
}
|
||||
|
||||
.function,
|
||||
.python .decorator,
|
||||
.python .title,
|
||||
.ruby .function .title,
|
||||
.ruby .title .keyword,
|
||||
.perl .sub,
|
||||
.javascript .title,
|
||||
.coffeescript .title {
|
||||
color: $highlight-blue;
|
||||
}
|
||||
|
||||
.keyword,
|
||||
.javascript .function {
|
||||
color: $highlight-purple;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
code {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 1px solid #E9E9EF;
|
||||
border-radius: 4px;
|
||||
outline: 0;
|
||||
font-weight: normal;
|
||||
font-family: inherit;
|
||||
font-size: 0.9em;
|
||||
vertical-align: baseline;
|
||||
font-family: $font-mono;
|
||||
color: #46af91;
|
||||
background: #F7F7F9;
|
||||
padding: 0 5px;
|
||||
}
|
||||
.article pre {
|
||||
&[class*="language-"] {
|
||||
border-left: 8px solid $color-link;
|
||||
padding: 0.5em 0.25em;
|
||||
margin-top: 1em;
|
||||
|
||||
a code {
|
||||
color: $color-link;
|
||||
|
||||
&:hover {
|
||||
color: $color-link-hover;
|
||||
}
|
||||
}
|
||||
|
||||
.highlight {
|
||||
padding: 10px 15px;
|
||||
color: $highlight-foreground;
|
||||
background: $highlight-background;
|
||||
line-height: $line-height;
|
||||
overflow: auto;
|
||||
margin: 0;
|
||||
|
||||
&.shell {
|
||||
background: #252831;
|
||||
pre {
|
||||
color: #c4c5ca;
|
||||
}
|
||||
}
|
||||
|
||||
pre {
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
table {
|
||||
margin: 0 !important;
|
||||
border: 0;
|
||||
|
||||
th {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
td {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
|
||||
figcaption {
|
||||
margin: -5px 0 5px;
|
||||
font-size: 0.9em;
|
||||
color: $color-gray;
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
display: table;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
a {
|
||||
float: right;
|
||||
color: $highlight-foreground;
|
||||
|
||||
&:hover { border-bottom-color: $highlight-foreground; }
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
height: 22px;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.gutter {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
//
|
||||
// .comment { color: $highlight-comment; }
|
||||
//
|
||||
// .variable,
|
||||
// .attribute,
|
||||
// .tag,
|
||||
// .regexp,
|
||||
// .ruby .constant,
|
||||
// .xml .tag .title,
|
||||
// .xml .pi,
|
||||
// .xml .doctype,
|
||||
// .html .doctype,
|
||||
// .css .id,
|
||||
// .css .class,
|
||||
// .css .pseudo {
|
||||
// color: $highlight-red;
|
||||
// }
|
||||
//
|
||||
// .attr,
|
||||
// .number {
|
||||
// color: $highlight-purple;
|
||||
// }
|
||||
//
|
||||
// .preprocessor,
|
||||
// .built_in,
|
||||
// .literal,
|
||||
// .params,
|
||||
// .constant,
|
||||
// .command {
|
||||
// color: $highlight-orange;
|
||||
// }
|
||||
//
|
||||
// .ruby .class .title,
|
||||
// .css .rules .attribute,
|
||||
// .string,
|
||||
// .value,
|
||||
// .inheritance,
|
||||
// .header,
|
||||
// .ruby .symbol,
|
||||
// .xml .cdata,
|
||||
// .special,
|
||||
// .formula {
|
||||
// color: $highlight-blue;
|
||||
// }
|
||||
//
|
||||
// .title,
|
||||
// .css .hexcolor {
|
||||
// color: $highlight-aqua;
|
||||
// }
|
||||
//
|
||||
// .function,
|
||||
// .python .decorator,
|
||||
// .python .title,
|
||||
// .ruby .function .title,
|
||||
// .ruby .title .keyword,
|
||||
// .perl .sub,
|
||||
// .javascript .title,
|
||||
// .coffeescript .title {
|
||||
// color: $highlight-blue;
|
||||
// }
|
||||
//
|
||||
// .keyword,
|
||||
// .javascript .function {
|
||||
// color: $highlight-aqua;
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// code {
|
||||
// margin: 0;
|
||||
// padding: 0;
|
||||
// border: 1px solid #E9E9EF;
|
||||
// border-radius: 4px;
|
||||
// outline: 0;
|
||||
// font-weight: normal;
|
||||
// font-family: inherit;
|
||||
// font-size: 0.9em;
|
||||
// vertical-align: baseline;
|
||||
// font-family: $font-mono;
|
||||
// color: #46af91;
|
||||
// background: #F7F7F9;
|
||||
// padding: 0 5px;
|
||||
// }
|
||||
//
|
||||
// a code {
|
||||
// color: $color-link;
|
||||
//
|
||||
// &:hover {
|
||||
// color: $color-link-hover;
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// .highlight {
|
||||
// padding: 10px 15px;
|
||||
// color: $highlight-foreground;
|
||||
// background: $highlight-background;
|
||||
// line-height: $line-height;
|
||||
// overflow: auto;
|
||||
// margin: 0;
|
||||
//
|
||||
// &.shell {
|
||||
// background: #252831;
|
||||
// pre {
|
||||
// color: #c4c5ca;
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// pre {
|
||||
// border: none;
|
||||
// margin: 0;
|
||||
// padding: 1px;
|
||||
// }
|
||||
//
|
||||
// table {
|
||||
// margin: 0 !important;
|
||||
// border: 0;
|
||||
//
|
||||
// th {
|
||||
// padding: 0;
|
||||
// border: 0;
|
||||
// }
|
||||
//
|
||||
// td {
|
||||
// padding: 0;
|
||||
// border: 0;
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// figcaption {
|
||||
// margin: -5px 0 5px;
|
||||
// font-size: 0.95em;
|
||||
// color: $color-gray;
|
||||
//
|
||||
// &:before {
|
||||
// content: "";
|
||||
// display: table;
|
||||
// }
|
||||
//
|
||||
// &:after {
|
||||
// content: "";
|
||||
// display: table;
|
||||
// clear: both;
|
||||
// }
|
||||
//
|
||||
// a {
|
||||
// float: right;
|
||||
// color: $highlight-foreground;
|
||||
//
|
||||
// &:hover { border-bottom-color: $highlight-foreground; }
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// .line {
|
||||
// height: 22px;
|
||||
// font-size: 0.9em;
|
||||
// }
|
||||
//
|
||||
// .gutter {
|
||||
// display: none;
|
||||
// }
|
||||
// }
|
||||
|
||||
16
docs/themes/cypress/source/css/_variables.scss
vendored
16
docs/themes/cypress/source/css/_variables.scss
vendored
@@ -17,20 +17,20 @@ $color-background: #24262F;
|
||||
$highlight-background: #f7f7f7;
|
||||
$highlight-current-line: #efefef;
|
||||
$highlight-selection: #d6d6d6;
|
||||
$highlight-foreground: #4d4d4c;
|
||||
$highlight-comment: #8e908c;
|
||||
$highlight-red: #c82829;
|
||||
$highlight-orange: #f5871f;
|
||||
$highlight-foreground: #43474a;
|
||||
$highlight-comment: #999;
|
||||
$highlight-red: #c92c2c;
|
||||
$highlight-orange: #cc8300;
|
||||
$highlight-yellow: #eab700;
|
||||
$highlight-green: #718c00;
|
||||
$highlight-aqua: #3e999f;
|
||||
$highlight-blue: #4271ae;
|
||||
$highlight-purple: #8959a8;
|
||||
$highlight-aqua: #1d75b3;
|
||||
$highlight-blue: #183691;
|
||||
$highlight-purple: #795da3;
|
||||
|
||||
// Typography
|
||||
$font-sans: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||
$font-serif: Garamond, Georgia, "Times New Roman", serif;
|
||||
$font-mono: Consolas, Monaco, 'Andale Mono', monospace;
|
||||
$font-mono: Consolas, "Liberation Mono", Menlo, Courier, monospace;
|
||||
$font-title: "Fira Sans", font-sans;
|
||||
$font-size: 16px;
|
||||
$line-height: 1.7em;
|
||||
|
||||
Reference in New Issue
Block a user