- I possess a wide range of skills that enable me to develop visually appealing and - interactive user interfaces for web applications. -
-- Over the years, I have honed my ability to create visually appealing interfaces that - are both user-friendly and intuitive. -
-- I understand the importance of creating a seamless UX for end-users. Which includes - a solid understanding user behavior. -
-+ I hone my problem solving and coding skills all the time. I try to learn the underlying + mechanics and use abstractions where relevant. +
++ I try to create better, novel ways to approach problems and give my best to present them + in a clear and concise manner. +
++ From my experience with a wide range of roles I understand the how to communication with + stakeholders across an organization. +
+${lang}${lines.map(lineRenderer(options)).join('\n')}\n`;
+}
+
+const lineRenderer = (options) => (line) => {
+ const output = line.map(tokenRenderer(options)).join('');
+ const { leadingWS, content, trailingWS } = splitLeadingAndTrailingWS(output);
+ return `${leadingWS || ''}${content || ''}${
+ trailingWS || ''
+ }`;
+};
+
+const tokenRenderer = (options) => (token) => {
+ if (!token.color || token.color.toLowerCase() === options.fg) {
+ return escape(token.content);
+ }
+ const { leadingWS, content, trailingWS } = splitLeadingAndTrailingWS(token.content);
+ if (!content) {
+ return leadingWS;
+ }
+
+ return `${leadingWS}${escape(content)}${trailingWS}`;
+};
+
+function splitLeadingAndTrailingWS(content) {
+ const len = content.length;
+ let start = 0;
+ let end = len;
+
+ while (start < end && isWS(content.charAt(start))) {
+ start++;
+ }
+
+ if (start === end) {
+ return {
+ leadingWS: content || ''
+ };
+ }
+
+ while (end > start && isWS(content.charAt(end - 1))) {
+ end--;
+ }
+
+ return {
+ leadingWS: content.slice(0, start),
+ content: content.slice(start, end),
+ trailingWS: end < content.length ? content.slice(end) : ''
+ };
+}
+
+function isWS(char) {
+ return char === ' ' || char === '\t';
+}
+
+function isPlaintext(lang) {
+ return !lang || ['plaintext', 'txt', 'text'].indexOf(lang) !== -1;
+}
+
+const defaultOpts = {
+ theme: 'nord',
+ fg: undefined,
+ bg: undefined,
+ showLineNumbers: (numberOfLines) => numberOfLines > 5
+};
+
+export default async function createHighlighter(opts) {
+ const options = { ...defaultOpts, ...opts };
+
+ if (options.theme.endsWith('.json')) {
+ options.theme = loadTheme(options.theme);
+ } else {
+ options.theme = getTheme(options.theme);
+ }
+ const baseSettings = (
+ (options.theme['tokenColors'] || []).find((x) => !x.scope) || { settings: {} }
+ ).settings;
+ const colors = options.theme.colors || {};
+ const getThemeColor = (name) => baseSettings[name] || colors[`editor.${name}`] || colors[name];
+ const fg = (options.fg || getThemeColor('foreground') || '#eeeeee').toLowerCase();
+ const bg = (options.bg || getThemeColor('background') || '#222222').toLowerCase();
+ return getHighlighter(options).then(
+ (highlighter) => (code, lang) =>
+ render(
+ isPlaintext(lang)
+ ? [[{ content: code }]]
+ : highlighter.codeToTokensBase(code, lang),
+ { ...options, fg, bg, lang }
+ )
+ );
+}
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 58026c4..27226db 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -1,48 +1,26 @@