fix: over flowing table that destroy the layout (#4872)

4 files changed, 30 insertions, 4 deletions

diff --git a/p/themes/base-theme/base.css b/p/themes/base-theme/base.css
index 9f2e23a9c..6b8f1ec49 100644
--- a/p/themes/base-theme/base.css
+++ b/p/themes/base-theme/base.css
@@ -61,8 +61,7 @@ table {
 	border-collapse: collapse;
 }
 
-tr, th, td {
-	padding: 0.5em;
+th, td {
 }
 
 th {
diff --git a/p/themes/base-theme/base.rtl.css b/p/themes/base-theme/base.rtl.css
index da9d401a9..5dbeb1c8d 100644
--- a/p/themes/base-theme/base.rtl.css
+++ b/p/themes/base-theme/base.rtl.css
@@ -61,8 +61,7 @@ table {
 	border-collapse: collapse;
 }
 
-tr, th, td {
-	padding: 0.5em;
+th, td {
 }
 
 th {
diff --git a/p/themes/base-theme/frss.css b/p/themes/base-theme/frss.css
index 42f6c05f6..f5aaea902 100644
--- a/p/themes/base-theme/frss.css
+++ b/p/themes/base-theme/frss.css
@@ -333,9 +333,14 @@ button.as-link[disabled] {
 }
 
 table {
+	margin: 0.5rem 0;
 	max-width: 100%;
 }
 
+th, td {
+	padding: 0.5rem;
+}
+
 th.numeric,
 td.numeric {
 	text-align: center;
@@ -1280,6 +1285,7 @@ a.website:hover .favicon {
 	padding: 0.75rem;
 	line-height: 1.5;
 	word-wrap: break-word;
+	overflow: auto;
 }
 
 .content.large {
@@ -2132,6 +2138,14 @@ input:checked + .slide-container .properties {
 		padding: 1rem;
 	}
 
+	table {
+		font-size: 0.9rem;
+	}
+
+	th, td {
+		padding: 0.25rem;
+	}
+
 	.notification {
 		top: 0;
 		left: 0;
diff --git a/p/themes/base-theme/frss.rtl.css b/p/themes/base-theme/frss.rtl.css
index 77ff17934..d3fdf4a02 100644
--- a/p/themes/base-theme/frss.rtl.css
+++ b/p/themes/base-theme/frss.rtl.css
@@ -333,9 +333,14 @@ button.as-link[disabled] {
 }
 
 table {
+	margin: 0.5rem 0;
 	max-width: 100%;
 }
 
+th, td {
+	padding: 0.5rem;
+}
+
 th.numeric,
 td.numeric {
 	text-align: center;
@@ -1280,6 +1285,7 @@ a.website:hover .favicon {
 	padding: 0.75rem;
 	line-height: 1.5;
 	word-wrap: break-word;
+	overflow: auto;
 }
 
 .content.large {
@@ -2132,6 +2138,14 @@ input:checked + .slide-container .properties {
 		padding: 1rem;
 	}
 
+	table {
+		font-size: 0.9rem;
+	}
+
+	th, td {
+		padding: 0.25rem;
+	}
+
 	.notification {
 		top: 0;
 		right: 0;