Fix ParamViewer css (#7130)

* Fix ParamViewer styles

* add changeset

* Fix description background color

* ParamViewer

* bottom border

* tweak

---------

Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
Co-authored-by: pngwn <hello@pngwn.io>

.changeset/olive-hoops-hunt.md

@@ -0,0 +1,6 @@
+---
+"@gradio/paramviewer": patch
+"gradio": patch
+---
+
+fix:Fix ParamViewer css

js/paramviewer/ParamViewer.svelte

@@ -101,11 +101,11 @@
 
 	.wrap :global(pre),
 	.wrap :global(.highlight) {
-		margin: 0;
+		margin: 0 !important;
 		background: transparent !important;
 		font-family: var(--font-mono);
 		font-weight: 400;
-		padding: 0;
+		padding: 0 !important;
 	}
 
 	.wrap :global(pre a) {
@@ -142,7 +142,7 @@
 		border-width: var(--block-border-width);
 		border-color: var(--block-border-color);
 		border-radius: var(--block-radius);
-		background: #fff;
+		background: var(--table-odd-background-fill);
 		width: 100%;
 		line-height: var(--line-sm);
 		color: var(--body-text-color);
@@ -151,10 +151,8 @@
 	.type {
 		position: relative;
 		padding: 0.7rem 1rem;
-		background: var(--neutral-900);
-		background: var(--neutral-50);
-		border-bottom: 1px solid var(--neutral-700);
-		border-bottom: 0px solid var(--neutral-200);
+		background: var(--table-odd-background-fill);
+		border-bottom: 0px solid var(--table-border-color);
 	}
 
 	.arrow {
@@ -175,7 +173,8 @@
 
 	.default {
 		padding: 0.2rem 1rem 0.3rem 1rem;
-		border-bottom: 1px solid var(--neutral-200);
+		border-bottom: 1px solid var(--table-border-color);
+		background: var(--block-background-fill);
 	}
 
 	.default.last {
@@ -186,10 +185,15 @@
 		padding: 0.7rem 1rem;
 		font-size: var(--scale-00);
 		font-family: var(--font-sans);
+		background: var(--block-background-fill);
 	}
 
 	.param {
-		border-bottom: 1px solid var(--neutral-200);
+		border-bottom: 1px solid var(--table-border-color);
+	}
+
+	.param:last-child {
+		border-bottom: none;
 	}
 
 	.param:last-child .description {
@@ -203,31 +207,4 @@
 	.param.md code {
 		background: none;
 	}
-
-	@media (prefers-color-scheme: dark) {
-		.wrap {
-			background: var(--neutral-800);
-		}
-
-		.default {
-			border-bottom: 1px solid var(--neutral-700);
-		}
-
-		.type {
-			background: var(--neutral-900);
-			border-bottom: 0px solid var(--neutral-700);
-		}
-
-		.arrow {
-			color: var(--neutral-200);
-		}
-
-		.param {
-			border-bottom: 1px solid var(--neutral-700);
-		}
-
-		.param:last-child {
-			border-bottom: none;
-		}
-	}
 </style>