Skip to content

Commit 654bec6

Browse files
committed
Revert floating descriptions on IPv4Network
1 parent be8d92a commit 654bec6

File tree

1 file changed

+16
-17
lines changed

1 file changed

+16
-17
lines changed

src/components/blend/IPv4Network.svelte

Lines changed: 16 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -59,18 +59,19 @@ to augment IPv4 with Network and Netmask visualization
5959
<div class="relative">
6060
<small class="absolute text-gray-400 w-full">
6161
<div class="relative">
62-
<div class="absolute w-full h-full overflow-clip z--10">
62+
<div class="absolute w-full h-full">
6363
<div class="h-full bg-gray-200" style:width={`${(prefix / 32) * 100}%`} />
6464
</div>
65-
<div class="mix-blend-colo/r">
66-
<pre class="inline-block ml-2">Netmask:</pre>
67-
<div class="inline-block">
68-
<PartialTransition notation={renderedMask} fstDelimiter={' = '} />
69-
</div>
70-
</div>
65+
<pre class="opacity-0">placeholder</pre>
7166
</div>
7267
</small>
7368
</div>
69+
<small class="absolute text-gray-400 w-full">
70+
<pre class="inline-block ml-2">Netmask:</pre>
71+
<div class="inline-block">
72+
<PartialTransition notation={renderedMask} fstDelimiter={' = '} />
73+
</div>
74+
</small>
7475
<small><pre class="opacity-0">placeholder</pre></small>
7576
<div class="relative">
7677
<div class="absolute w-full h-full rounded-b overflow-clip z--10">
@@ -92,16 +93,14 @@ to augment IPv4 with Network and Netmask visualization
9293
/>
9394
</div>
9495
</div>
95-
<div class="relative mb-1">
96-
<small class="absolute mx-2 text-gray-600 mt-0.6">
97-
<pre class="inline-block text-cyan">Network:</pre>
98-
<div class="inline-block text-cyan">
99-
<PartialTransition notation={renderedNetwork} />
100-
</div>
101-
<pre class="text-gray-400 inline-block lt-xs:hidden">= Address & Netmask</pre>
102-
</small>
103-
<small><pre class="opacity-0">placeholder</pre></small>
104-
</div>
96+
<small class="absolute mx-2 text-gray-600 mt-0.6">
97+
<pre class="inline-block text-cyan">Network:</pre>
98+
<div class="inline-block text-cyan">
99+
<PartialTransition notation={renderedNetwork} />
100+
</div>
101+
<pre class="text-gray-400 inline-block lt-xs:hidden">= Address & Netmask</pre>
102+
</small>
103+
<small><pre class="opacity-0 mb-1">placeholder</pre></small>
105104
<Bits
106105
hideHeader={true}
107106
integer={network}

0 commit comments

Comments
 (0)