From f63cbf59e3c527e74bfe1cd370df43bfe22b011e Mon Sep 17 00:00:00 2001
From: finanalyst <rnhainsworth@gmail.com>
Date: Mon, 17 Jun 2024 10:20:06 +0100
Subject: [PATCH] addresses issue in #353 label obsuring inner div - in a code
 box, the 'language' label was obscuring the contents of the code box it
 labelled - code box contents were overflowing to right - this patch does not
 change problem in #396

---
 Website/plugins/hiliter/_highlighting.scss | 5 +++++
 Website/plugins/hiliter/config.raku        | 2 +-
 Website/plugins/hiliter/hiliter-dark.css   | 5 +++++
 Website/plugins/hiliter/hiliter-light.css  | 5 +++++
 4 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/Website/plugins/hiliter/_highlighting.scss b/Website/plugins/hiliter/_highlighting.scss
index c8beb9b..15b4ede 100644
--- a/Website/plugins/hiliter/_highlighting.scss
+++ b/Website/plugins/hiliter/_highlighting.scss
@@ -22,6 +22,8 @@
     float: right;
     font-size: xx-small;
     font-style: italic;
+    height: auto;
+    margin: 0 5px 0 0;
   }
 
 // required to match highlights-js css with raku highlighter css
@@ -36,6 +38,9 @@
    pre {
     background-color: $code-background;
     color: $code-foreground;
+    display: inline-block;
+    overflow: scroll;
+    width: 96%;
   }
   .rakudoc-in-code {
     padding: 1.25rem 1.5rem;
diff --git a/Website/plugins/hiliter/config.raku b/Website/plugins/hiliter/config.raku
index 169464f..a0ab99a 100644
--- a/Website/plugins/hiliter/config.raku
+++ b/Website/plugins/hiliter/config.raku
@@ -8,7 +8,7 @@
 	:name<hiliter>,
 	:render,
 	:template-raku<template.raku>,
-	:version<0.1.4>,
+	:version<0.1.5>,
 	:css-link(
 		'href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/styles/atom-one-light.min.css" title="light"',
 		'href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/styles/atom-one-dark.min.css" title="dark"',
diff --git a/Website/plugins/hiliter/hiliter-dark.css b/Website/plugins/hiliter/hiliter-dark.css
index 7cebc0a..0d59556 100644
--- a/Website/plugins/hiliter/hiliter-dark.css
+++ b/Website/plugins/hiliter/hiliter-dark.css
@@ -85,6 +85,8 @@ textarea::selection {
   float: right;
   font-size: xx-small;
   font-style: italic;
+  height: auto;
+  margin: 0 5px 0 0;
 }
 .raku-code pre.browser-hl {
   padding: 7px;
@@ -98,6 +100,9 @@ textarea::selection {
 .raku-code pre {
   background-color: #212426;
   color: #f2f2f2;
+  display: inline-block;
+  overflow: scroll;
+  width: 96%;
 }
 .raku-code .rakudoc-in-code {
   padding: 1.25rem 1.5rem;
diff --git a/Website/plugins/hiliter/hiliter-light.css b/Website/plugins/hiliter/hiliter-light.css
index 07e73e1..9904136 100644
--- a/Website/plugins/hiliter/hiliter-light.css
+++ b/Website/plugins/hiliter/hiliter-light.css
@@ -62,6 +62,8 @@
   float: right;
   font-size: xx-small;
   font-style: italic;
+  height: auto;
+  margin: 0 5px 0 0;
 }
 .raku-code pre.browser-hl {
   padding: 7px;
@@ -75,6 +77,9 @@
 .raku-code pre {
   background-color: #fafafa;
   color: #030303;
+  display: inline-block;
+  overflow: scroll;
+  width: 96%;
 }
 .raku-code .rakudoc-in-code {
   padding: 1.25rem 1.5rem;