]> git.ardis.lu - utf-8-visualizer/commitdiff
Add space in between bytes
authorArdis Lu <ardisglu@gmail.com>
Sat, 26 Apr 2025 05:30:06 +0000 (22:30 -0700)
committerArdis Lu <ardisglu@gmail.com>
Sat, 26 Apr 2025 05:30:06 +0000 (22:30 -0700)
style.css

index bc04715c6a2c4c5cd88132f329749a16cf9e6074..083d8664ee182fd55dcd6f90d97f0c753326a653 100644 (file)
--- a/style.css
+++ b/style.css
@@ -108,11 +108,15 @@ a:not(.icon-link) {
   line-height: 0;
   overflow: hidden;
   visibility: hidden;
-  transition: inline-size 600ms;
+  transition: inline-size 600ms, margin 600ms;
 }
 
 :is(al-point-visualization:hover, al-point-visualization:focus-within) .shrink {
-  transition: inline-size 200ms;
+  transition: inline-size 200ms, margin 200ms;
+
+  &:not(:first-child) {
+    margin-inline-start: 1ch;
+  }
 }
 
 /* Can't use inline-size: fit-content or inline-size: auto, must hardcode a concrete size for transition to work. */
@@ -139,6 +143,10 @@ a:not(.icon-link) {
 /* For the raw UTF-8 bytes */
 .insignificant {
   transition: opacity 600ms;
+
+  &:not(:first-child) {
+    margin-inline-start: 1ch;
+  }
 }
 
 :is(al-point-visualization:hover, al-point-visualization:focus-within) .insignificant {
This page took 0.038712 seconds and 4 git commands to generate.