Skip to content

Commit

Permalink
Rewrite in Vite, switch to Shiki
Browse files Browse the repository at this point in the history
  • Loading branch information
romannurik committed Oct 31, 2024
1 parent 09c00d9 commit 8365385
Show file tree
Hide file tree
Showing 44 changed files with 6,189 additions and 8,440 deletions.
20 changes: 20 additions & 0 deletions .eslintrc.cjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
module.exports = {
root: true,
env: { browser: true, es2020: true },
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'plugin:react-hooks/recommended',
],
ignorePatterns: ['dist', '.eslintrc.cjs'],
parser: '@typescript-eslint/parser',
plugins: ['react-refresh'],
rules: {
'prefer-const': 'off',
'@typescript-eslint/no-unused-vars': 'warn',
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
},
}
28 changes: 22 additions & 6 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,10 +1,26 @@
_sandbox
.sass-cache
.tmp

# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*

node_modules
bower_components
dist
dist-ssr
*.local

# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
.publish
*.sublime-workspace
*~
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
140 changes: 0 additions & 140 deletions gulpfile.js

This file was deleted.

144 changes: 12 additions & 132 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,134 +1,14 @@
<!doctype html>
<html>
<head>
<title>SlidesCodeHighlighter</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:400,500|Roboto+Mono:400,700">
<link rel="stylesheet" href="index.css">
<link rel="manifest" href="manifest.json">
<link rel="icon" href="favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>

<div class="edit-area">
<div class="title-bar">Paste code below</div>
<div class="toolbar">
<label>
<span>Language</span>
<div class="input-datalist-wrapper">
<input id="lang" name="lang" list="lang-datalist"
type="text"
placeholder="(auto)"
autocapitalize="off"
spellcheck="false">
<datalist id="lang-datalist">
</datalist>
</div>
</label>

<label>
<span>Tab size</span>
<div class="select-wrapper">
<select id="tab-size">
<option value="2">2</option>
<option value="4">4</option>
</select>
</div>
</label>
</div>
<div id="editor"></div>
<div class="messages"></div>
</div>
<div class="output-area">
<div class="title-bar">Copy the formatted code below</div>
<div class="toolbar">
<label>
<span>Theme</span>
<div class="select-wrapper">
<select id="theme">
<option value="light">Light</option>
<option value="light-alt">Light (alternate)</option>
<option value="dark">Dark</option>
<option value="dark-alt">Dark (alternate)</option>
<option value="design-dark">Dark (design)</option>
<option value="io17">#io17</option>
<option value="io19">#io19</option>
<option value="flutter-interact-19">Flutter Interact 2019</option>
<option value="angular-light">Angular Light</option>
<option value="angular-dark">Angular Dark</option>
<option value="flutter2022">Flutter 2022</option>
<option value="custom">Custom</option>
</select>
</div>
</label>

<label>
<span>Font</span>
<div class="select-wrapper">
<select id="font">
<option value="Anonymous Pro">Anonymous Pro</option>
<option value="B612 Mono">B612 Mono</option>
<option value="Courier Prime">Courier Prime</option>
<option value="Cousine">Cousine</option>
<option value="Cutive Mono">Cutive Mono</option>
<option value="Fira Code">Fira Code</option>
<option value="Fira Mono">Fira Mono</option>
<option value="IBM Plex Mono">IBM Plex Mono</option>
<option value="Inconsolata">Inconsolata</option>
<option value="JetBrains Mono">JetBrains Mono</option>
<option value="Major Mono Display">Major Mono Display</option>
<option value="Nanum Gothic Coding">Nanum Gothic Coding</option>
<option value="Nova Mono">Nova Mono</option>
<option value="Overpass Mono">Overpass Mono</option>
<option value="Oxygen Mono">Oxygen Mono</option>
<option value="PT Mono">PT Mono</option>
<option value="Roboto Mono">Roboto Mono</option>
<option value="Share Tech Mono">Share Tech Mono</option>
<option value="Source Code Pro">Source Code Pro</option>
<option value="Space Mono">Space Mono</option>
<option value="Ubuntu Mono">Ubuntu Mono</option>
<option value="VT323">VT323</option>
</select>
</div>
</label>

<label>
<span>Type size</span>
<input type="text" id="type-size" value="40">
</label>

<label>
<span>Selected text</span>
<div class="select-wrapper">
<select id="selection-treatment">
<option value="--">Do nothing</option>
<option value="focus">Focus</option>
<option value="bold">Bold</option>
<option value="highlight">Highlight</option>
</select>
</div>
</label>
</div>
<div id="output"></div>
<div class="messages">
<div class="message message-info">
For best results, copy from Safari with Keynote decks and from Chrome
with Google Slides decks.
</div>
<div class="message message-info message-bgcolor"></div>
</div>
</div>
<div class="custom-theme-area">
<div class="title-bar">Custom theme</div>
<div class="toolbar">
<button class="custom-theme-import-export">Import/export</button>
<button class="custom-theme-reset">Reset</button>
</div>
<div class="custom-theme-editor"></div>
</div>

<script src="prism.js"></script>
<script src="index.js"></script>

</body>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:400,500|Roboto+Mono:400,700">
<link rel="icon" href="favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SlidesCodeHighlighter</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
Loading

0 comments on commit 8365385

Please sign in to comment.