mirror of
https://github.com/spacedriveapp/spacedrive.git
synced 2026-02-20 07:37:26 -05:00
a670d5a032
* added some files `standard` mime type * Used `TEXTViewer` Component to show Code Preview * Update Thumb.tsx * added `prismjs` * removed unnecessary comment * `CODEViewer` Component for Syntax Highlighting * formatting * using **Atom** Theme for `Prism` * merge text/code viewers & bg-app-focus for prism currently calling onError and onLoad without an Event argument that should change but i'm not really sure what to do there * removed unused imports * Update index.ts * `TEXTViewer` to `TextViewer_` * `TextViewer_` to `TextViewer` * Don't highlight normal TextFiles * clean code * `TEXTViewer` to `TextViewer` * using tailwind classes more * doing things correctly. * installed `prismjs` in interface * using own scroller * Update Thumb.tsx * Add an AbortController to the fetch request - Fix onError and onLoad calls - Format code * Fix onError being called when request was aborted due to re-render - Fix Compoenent re-rendering loop due to circular reference in useEffect - Remove unused imports * Improve text file serving and code syntax highlight - Implement way to identify text files in file-ext crate - Do not depend only on the file extension to identify text files in custom_uri - Import more prismjs language rules files - Add line numbers to TextViewer when rendering code * Clippy and prettier * Fix reading zero byte data to Vec - Improve empty file handling * Expand code highlight to more file types - Fix 10MB when it should be 10KB - Add supported for more code and config files extensions to sd-file-ext - Add comlink and vite-plugin-comlink for easy js worker integration - Move Prismjs logic to a Worker, because larger files (1000+ lines) where causing the UI to hang - Replace line-number prismjs plugin with our own implementation * Fix uppercase extension name --------- Co-authored-by: Utku <74243531+utkubakir@users.noreply.github.com> Co-authored-by: pr <pineapplerind.info@gmail.com> Co-authored-by: Vítor Vasconcellos <vasconcellos.dev@gmail.com>
144 lines
1.9 KiB
CSS
144 lines
1.9 KiB
CSS
/**
|
|
* atom-dark theme for `prism.js`
|
|
* Based on Atom's `atom-dark` theme: https://github.com/atom/atom-dark-syntax
|
|
* @author Joe Gibson (@gibsjose)
|
|
*/
|
|
|
|
code[class*='language-'],
|
|
pre[class*='language-'] {
|
|
color: #c5c8c6;
|
|
text-shadow: 0 1px rgba(0, 0, 0, 0.3);
|
|
font-family: Inconsolata, Monaco, Consolas, 'Courier New', Courier, monospace;
|
|
direction: ltr;
|
|
text-align: left;
|
|
white-space: pre;
|
|
word-spacing: normal;
|
|
word-break: normal;
|
|
line-height: 1.5;
|
|
|
|
-moz-tab-size: 4;
|
|
-o-tab-size: 4;
|
|
tab-size: 4;
|
|
|
|
-webkit-hyphens: none;
|
|
-moz-hyphens: none;
|
|
-ms-hyphens: none;
|
|
hyphens: none;
|
|
}
|
|
|
|
/* Code blocks */
|
|
pre[class*='language-'] {
|
|
padding: 1em;
|
|
margin: 0.5em 0;
|
|
overflow: auto;
|
|
border-radius: 0.3em;
|
|
}
|
|
|
|
:not(pre) > code[class*='language-'],
|
|
pre[class*='language-'] {
|
|
@apply bg-app-focus;
|
|
}
|
|
|
|
/* Inline code */
|
|
:not(pre) > code[class*='language-'] {
|
|
padding: 0.1em;
|
|
border-radius: 0.3em;
|
|
}
|
|
|
|
.token.comment,
|
|
.token.prolog,
|
|
.token.doctype,
|
|
.token.cdata {
|
|
color: #7c7c7c;
|
|
}
|
|
|
|
.token.punctuation {
|
|
color: #c5c8c6;
|
|
}
|
|
|
|
.namespace {
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.token.property,
|
|
.token.keyword,
|
|
.token.tag {
|
|
color: #96cbfe;
|
|
}
|
|
|
|
.token.class-name {
|
|
color: #ffffb6;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.token.boolean,
|
|
.token.constant {
|
|
color: #99cc99;
|
|
}
|
|
|
|
.token.symbol,
|
|
.token.deleted {
|
|
color: #f92672;
|
|
}
|
|
|
|
.token.number {
|
|
color: #ff73fd;
|
|
}
|
|
|
|
.token.selector,
|
|
.token.attr-name,
|
|
.token.string,
|
|
.token.char,
|
|
.token.builtin,
|
|
.token.inserted {
|
|
color: #a8ff60;
|
|
}
|
|
|
|
.token.variable {
|
|
color: #c6c5fe;
|
|
}
|
|
|
|
.token.operator {
|
|
color: #ededed;
|
|
}
|
|
|
|
.token.entity {
|
|
color: #ffffb6;
|
|
cursor: help;
|
|
}
|
|
|
|
.token.url {
|
|
color: #96cbfe;
|
|
}
|
|
|
|
.language-css .token.string,
|
|
.style .token.string {
|
|
color: #87c38a;
|
|
}
|
|
|
|
.token.atrule,
|
|
.token.attr-value {
|
|
color: #f9ee98;
|
|
}
|
|
|
|
.token.function {
|
|
color: #dad085;
|
|
}
|
|
|
|
.token.regex {
|
|
color: #e9c062;
|
|
}
|
|
|
|
.token.important {
|
|
color: #fd971f;
|
|
}
|
|
|
|
.token.important,
|
|
.token.bold {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.token.italic {
|
|
font-style: italic;
|
|
}
|