Skip to content

Commit 4d7ad69

Browse files
authored
Fix spacing in UI code display (#501)
1 parent 4507388 commit 4d7ad69

File tree

5 files changed

+19
-12
lines changed

5 files changed

+19
-12
lines changed

packages/ui/src/cairo/App.svelte

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -194,9 +194,7 @@
194194
<div class="output rounded-r-3xl flex flex-col grow overflow-auto h-[calc(100vh-84px)]">
195195
<pre class="flex flex-col grow basis-0 overflow-auto">
196196
{#if showCode}
197-
<code class="hljs -cairo grow overflow-auto p-4">
198-
{@html highlightedCode}
199-
</code>
197+
<code class="hljs -cairo grow overflow-auto p-4">{@html highlightedCode}</code>
200198
{/if}
201199
</pre>
202200
</div>

packages/ui/src/cairo_alpha/App.svelte

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script lang="ts">
2-
import { createEventDispatcher } from 'svelte';
2+
import { createEventDispatcher, tick } from 'svelte';
33
44
import hljs from './highlightjs';
55
@@ -27,12 +27,20 @@
2727
2828
const dispatch = createEventDispatcher();
2929
30+
let showCode = true;
31+
async function allowRendering() {
32+
showCode = false;
33+
await tick();
34+
showCode = true;
35+
}
36+
3037
export let initialTab: string | undefined = 'ERC20';
3138
3239
export let tab: Kind = sanitizeKind(initialTab);
3340
$: {
3441
tab = sanitizeKind(tab);
3542
dispatch('tab-change', tab);
43+
allowRendering();
3644
};
3745
3846
export let initialOpts: InitialOptions = {};
@@ -74,6 +82,7 @@
7482
}
7583
}
7684
}
85+
allowRendering();
7786
}
7887
7988
$: code = printContract(contract);
@@ -183,7 +192,11 @@
183192
</div>
184193
</div>
185194
<div class="output rounded-r-3xl flex flex-col grow overflow-auto h-[calc(100vh-84px)]">
186-
<pre class="flex flex-col grow basis-0 overflow-auto"><code class="hljs -cairo grow overflow-auto p-4">{@html highlightedCode}</code></pre>
195+
<pre class="flex flex-col grow basis-0 overflow-auto">
196+
{#if showCode}
197+
<code class="hljs -cairo grow overflow-auto p-4">{@html highlightedCode}</code>
198+
{/if}
199+
</pre>
187200
</div>
188201
</div>
189202
</div>

packages/ui/src/solidity/App.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -452,7 +452,7 @@
452452
{/if}
453453
<pre class="flex flex-col grow basis-0 overflow-auto">
454454
{#if showCode}
455-
<code class="hljs -solidity grow overflow-auto p-4 {hasErrors ? 'no-select' : ''}">{@html highlightedCode}</code>
455+
<code class="hljs -solidity grow overflow-auto p-4 {hasErrors ? 'no-select' : ''}">{@html highlightedCode}</code>
456456
{/if}
457457
</pre>
458458
<DefenderDeployModal isOpen={showDeployModal} />

packages/ui/src/stellar/App.svelte

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -144,9 +144,7 @@
144144
<div class="output rounded-r-3xl flex flex-col grow overflow-auto h-[calc(100vh-84px)]">
145145
<pre class="flex flex-col grow basis-0 overflow-auto">
146146
{#if showCode}
147-
<code class="hljs -stellar grow overflow-auto p-4">
148-
{@html highlightedCode}
149-
</code>
147+
<code class="hljs -stellar grow overflow-auto p-4">{@html highlightedCode}</code>
150148
{/if}
151149
</div>
152150
</div>

packages/ui/src/stylus/App.svelte

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -164,9 +164,7 @@
164164
<div class="output rounded-r-3xl flex flex-col grow overflow-auto h-[calc(100vh-84px)]">
165165
<pre class="flex flex-col grow basis-0 overflow-auto">
166166
{#if showCode}
167-
<code class="hljs -stylus grow overflow-auto p-4">
168-
{@html highlightedCode}
169-
</code>
167+
<code class="hljs -stylus grow overflow-auto p-4">{@html highlightedCode}</code>
170168
{/if}
171169
</pre>
172170
</div>

0 commit comments

Comments
 (0)