|
|
|
|
@ -3,12 +3,9 @@
|
|
|
|
|
|
|
|
|
|
/** @type {import('./console').Log[]} */
|
|
|
|
|
export let logs;
|
|
|
|
|
|
|
|
|
|
/** @type {'light' | 'dark'} */
|
|
|
|
|
export let theme;
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<div class="container" class:dark={theme === 'dark'}>
|
|
|
|
|
<div class="container">
|
|
|
|
|
{#each logs as log}
|
|
|
|
|
<ConsoleLine {log} />
|
|
|
|
|
{/each}
|
|
|
|
|
@ -17,20 +14,21 @@
|
|
|
|
|
<style>
|
|
|
|
|
.container {
|
|
|
|
|
--json-tree-string-color: var(--sk-code-string);
|
|
|
|
|
}
|
|
|
|
|
.dark {
|
|
|
|
|
--json-tree-property-color: #72a2d3;
|
|
|
|
|
--json-tree-string-color: #6cd1c7;
|
|
|
|
|
--json-tree-symbol-color: #6cd1c7;
|
|
|
|
|
--json-tree-boolean-color: #9681f7;
|
|
|
|
|
--json-tree-function-color: #e59b6f;
|
|
|
|
|
--json-tree-number-color: #9681f7;
|
|
|
|
|
--json-tree-label-color: #9ca0a5;
|
|
|
|
|
--json-tree-arrow-color: #e8eaed;
|
|
|
|
|
--json-tree-null-color: #81868a;
|
|
|
|
|
--json-tree-undefined-color: #81868a;
|
|
|
|
|
--json-tree-date-color: #9ca0a5;
|
|
|
|
|
--json-tree-operator-color: #e8eaed;
|
|
|
|
|
--json-tree-regex-color: #6cd1c7;
|
|
|
|
|
|
|
|
|
|
:global(.dark) & {
|
|
|
|
|
--json-tree-property-color: #72a2d3;
|
|
|
|
|
--json-tree-string-color: #6cd1c7;
|
|
|
|
|
--json-tree-symbol-color: #6cd1c7;
|
|
|
|
|
--json-tree-boolean-color: #9681f7;
|
|
|
|
|
--json-tree-function-color: #e59b6f;
|
|
|
|
|
--json-tree-number-color: #9681f7;
|
|
|
|
|
--json-tree-label-color: #9ca0a5;
|
|
|
|
|
--json-tree-arrow-color: #e8eaed;
|
|
|
|
|
--json-tree-null-color: #81868a;
|
|
|
|
|
--json-tree-undefined-color: #81868a;
|
|
|
|
|
--json-tree-date-color: #9ca0a5;
|
|
|
|
|
--json-tree-operator-color: #e8eaed;
|
|
|
|
|
--json-tree-regex-color: #6cd1c7;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|