Server-side syntax highlighting for all code (#12047)

* Server-side syntax hilighting for all code

This PR does a few things:

* Remove all traces of highlight.js
* Use chroma library to provide fast syntax hilighting directly on the server
* Provide syntax hilighting for diffs
* Re-style both unified and split diffs views
* Add custom syntax hilighting styling for both regular and arc-green

Fixes #7729
Fixes #10157
Fixes #11825
Fixes #7728
Fixes #3872
Fixes #3682

And perhaps gets closer to #9553

* fix line marker

* fix repo search

* Fix single line select

* properly load settings

* npm uninstall highlight.js

* review suggestion

* code review

* forgot to call function

* fix test

* Apply suggestions from code review

suggestions from @silverwind thanks

Co-authored-by: silverwind <me@silverwind.io>

* code review

* copy/paste error

* Use const for highlight size limit

* Update web_src/less/_repository.less

Co-authored-by: Lauris BH <lauris@nix.lv>

* update size limit to 1MB and other styling tweaks

* fix highlighting for certain diff sections

* fix test

* add worker back as suggested

Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: Lauris BH <lauris@nix.lv>
This commit is contained in:
mrsdizzie 2020-06-30 17:34:03 -04:00 committed by GitHub
parent ce5f2b9845
commit af7ffaa279
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
336 changed files with 37293 additions and 769 deletions

View file

@ -875,12 +875,6 @@ footer {
}
}
/* Overrides some styles of the Highlight.js plugin */
.hljs {
background: inherit !important;
padding: 0 !important;
}
.ui.menu.new-menu {
justify-content: center !important;
padding-top: 15px !important;
@ -1047,9 +1041,10 @@ i.icon.centerlock {
}
.lines-num {
padding-left: 10px;
padding-right: 10px;
text-align: right !important;
color: #999999;
background: #f5f5f5;
color: rgba(27, 31, 35, .3);
width: 1%;
user-select: none;
@ -1070,15 +1065,19 @@ i.icon.centerlock {
}
}
.lines-type-marker {
vertical-align: top;
}
.lines-num,
.lines-code {
padding: 0 !important;
padding-top: 0;
padding-bottom: 0;
vertical-align: top;
pre,
ol,
.hljs {
background-color: white;
ol {
background-color: inherit;
margin: 0;
padding: 0 !important;
@ -1090,6 +1089,15 @@ i.icon.centerlock {
}
}
.blame .lines-num {
padding: 0 !important;
background-color: #f5f5f5;
}
.blame .lines-code {
padding: 0 !important;
}
.lines-commit {
vertical-align: top;
color: #999999;
@ -1139,7 +1147,6 @@ i.icon.centerlock {
border-bottom: 1px solid #eaecef;
}
}
.code-view {
overflow: auto;
overflow-x: auto;
@ -1161,9 +1168,10 @@ i.icon.centerlock {
width: 100%;
}
.lines-code .active {
background: #fff6af;
.lines-code.active {
background: #fffbdd !important;
}
}
.octicon-tiny {