anew

utksi · Jan 17, 2025 · 0d43eb5 · 0d43eb5
1 parent 83b5f52
commit 0d43eb5
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 9 deletions.
diff --git a/_posts/2024-12-12-wannier_elf.md b/_posts/2024-12-12-wannier_elf.md
@@ -666,6 +666,9 @@ A good example is $$\mathrm{CeO_2}$$ where Cerium is supposed to have +4 and not
 <iframe src="/assets/plotly/elf_plot.html" frameborder='0' scrolling='no' height="750px" width="100%" style="border: 1px dashed grey;"></iframe>
 </div>
 
+{: .block-info }
+> If the image is empty, move the sliders at the bottom of the frame.
+
 ---
 
 ### **Conclusion**

diff --git a/_sass/_base.scss b/_sass/_base.scss
@@ -1009,55 +1009,68 @@ figure.highlight {
   max-width: 100%;
   border-radius: 6px;
   overflow: hidden;
+  background: var(--global-code-bg-color);
 
   table {
     margin: 0;
+    padding: 0;
     border: none;
     width: 100%;
     border-spacing: 0;
+    border-collapse: collapse;
 
     td {
       padding: 0;
       border: none;
+      vertical-align: top;
 
       &.gutter {
         width: 50px;
         min-width: 50px;
-        background: rgb(36, 27, 63);
-        border-right: 0.5px solid rgb(0, 0, 0);
+        max-width: 50px;
+        background: rgba(0,0,0,0.04);
+        border-right: 1px solid rgba(0,0,0,0.1);
 
         pre {
           margin: 0;
           padding: 1rem;
           text-align: right;
           color: rgba(0,0,0,0.4);
           user-select: none;
-          white-space: nowrap;
+          white-space: pre;
+          overflow: hidden;
         }
       }
 
       &.code {
-        width: 100%;
+        width: auto;
 
         pre {
           margin: 0;
           padding: 1rem;
-          overflow-x: auto;
-          white-space: pre-wrap;       /* Allow wrapping */
-          word-wrap: break-word;       /* Break long words if needed */
-          word-break: break-all;       /* Break words at any character */
+          white-space: pre-wrap;
+          word-wrap: break-word;
+          overflow-wrap: break-word;
+          overflow: visible;
         }
       }
     }
   }
+
+  // Ensure code lines align with line numbers
+  .gl {
+    white-space: pre;
+    width: 50px;
+    min-width: 50px;
+    padding-right: 10px;
+  }
 }
 
 pre {
   color: var(--global-theme-color);
   background-color: var(--global-code-bg-color);
   border-radius: 6px;
   padding: 6px 12px;
-  overflow-x: auto;
 
   pre,
   code {
@@ -1080,6 +1093,9 @@ code {
   pre {
     margin: 0;
     padding: 10px;
+    white-space: pre-wrap;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
   }
 }