From 8daa641b871da0c5d2db55707f724684b3392c1e Mon Sep 17 00:00:00 2001
From: Lauris BH <lauris@nix.lv>
Date: Thu, 22 Dec 2022 08:18:01 +0200
Subject: [PATCH 1/4] Fix container layer display overflow

---
 templates/package/content/container.tmpl | 2 +-
 web_src/less/_package.less               | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/templates/package/content/container.tmpl b/templates/package/content/container.tmpl
index a79963e732ba0..01bb70dcbce88 100644
--- a/templates/package/content/container.tmpl
+++ b/templates/package/content/container.tmpl
@@ -46,7 +46,7 @@
 	{{end}}
 	{{if .PackageDescriptor.Metadata.ImageLayers}}
 		<h4 class="ui top attached header">{{.locale.Tr "packages.container.layers"}}</h4>
-		<div class="ui attached segment">
+		<div class="ui attached segment container-layers">
 			<table class="ui very basic compact table">
 				<tbody>
 					{{range .PackageDescriptor.Metadata.ImageLayers}}
diff --git a/web_src/less/_package.less b/web_src/less/_package.less
index f4a07a1889961..00c7be38a203c 100644
--- a/web_src/less/_package.less
+++ b/web_src/less/_package.less
@@ -7,3 +7,7 @@
     overflow-wrap: anywhere;
   }
 }
+
+.container-layers {
+  overflow-x: auto;
+}

From 861f8c47ec566b7a5e52329fb72a18a94557e258 Mon Sep 17 00:00:00 2001
From: Lauris BH <lauris@nix.lv>
Date: Thu, 22 Dec 2022 12:00:55 +0200
Subject: [PATCH 2/4] Change to word break instead of scrolling

---
 web_src/less/_package.less | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web_src/less/_package.less b/web_src/less/_package.less
index 00c7be38a203c..a1be4df44bbd6 100644
--- a/web_src/less/_package.less
+++ b/web_src/less/_package.less
@@ -9,5 +9,5 @@
 }
 
 .container-layers {
-  overflow-x: auto;
+  word-break: break-all;
 }

From 0cecdd3642ed9a2af84768d3ac3792b603bf5704 Mon Sep 17 00:00:00 2001
From: Lauris BH <lauris@nix.lv>
Date: Thu, 22 Dec 2022 12:06:51 +0200
Subject: [PATCH 3/4] Remove custom style

---
 web_src/less/_package.less | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/web_src/less/_package.less b/web_src/less/_package.less
index a1be4df44bbd6..f4a07a1889961 100644
--- a/web_src/less/_package.less
+++ b/web_src/less/_package.less
@@ -7,7 +7,3 @@
     overflow-wrap: anywhere;
   }
 }
-
-.container-layers {
-  word-break: break-all;
-}

From 4de670ca2a48896a8f7e3229a2fd1a791a3b1357 Mon Sep 17 00:00:00 2001
From: Lauris BH <lauris@nix.lv>
Date: Thu, 22 Dec 2022 12:07:15 +0200
Subject: [PATCH 4/4] Use word break helper

---
 templates/package/content/container.tmpl | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/templates/package/content/container.tmpl b/templates/package/content/container.tmpl
index 01bb70dcbce88..34d495f356d25 100644
--- a/templates/package/content/container.tmpl
+++ b/templates/package/content/container.tmpl
@@ -46,7 +46,7 @@
 	{{end}}
 	{{if .PackageDescriptor.Metadata.ImageLayers}}
 		<h4 class="ui top attached header">{{.locale.Tr "packages.container.layers"}}</h4>
-		<div class="ui attached segment container-layers">
+		<div class="ui attached segment word-break">
 			<table class="ui very basic compact table">
 				<tbody>
 					{{range .PackageDescriptor.Metadata.ImageLayers}}