fix styles

Author: ahuseyn

plugins/wpgraphql-logging/assets/css/view/wp-graphql-logging-view.css

@@ -5,13 +5,24 @@
 	margin-bottom: 20px;
 }
 
-.wpgraphql-logging-view-table pre.wpgraphql-logging-query,
-.wpgraphql-logging-view-table pre.wpgraphql-logging-context,
-.wpgraphql-logging-view-table pre.wpgraphql-logging-extra {
+.wpgraphql-logging-details pre.wpgraphql-logging-query,
+.wpgraphql-logging-details pre.wpgraphql-logging-context,
+.wpgraphql-logging-details pre.wpgraphql-logging-extra {
 	white-space: pre-wrap;
 	max-height: 540px;
 	overflow-y: scroll;
 	padding: 15px;
 	border: 1px solid #ddd;
 	border-radius: 4px;
 }
+
+pre.wpgraphql-logging-list-table-query {
+	overflow-x: auto;
+	background: #f4f4f4;
+	margin-top: 0;
+	margin-bottom: 0;
+	padding: 15px;
+	border: 1px solid #ddd;
+	border-radius: 4px;
+	max-height: 20px;
+}

plugins/wpgraphql-logging/src/Admin/View/List/ListTable.php

@@ -413,7 +413,7 @@ protected function format_code(string $code): string {
 		if ( empty( $code ) ) {
 			return '';
 		}
-		return '<pre style="overflow-x: auto; background: #f4f4f4; padding: 15px; border: 1px solid #ddd; border-radius: 4px; max-height: 300px;">' . esc_html( $code ) . '</pre>';
+		return '<pre class="wpgraphql-logging-list-table-query">' . esc_html( $code ) . '</pre>';
 	}
 
 	/**

plugins/wpgraphql-logging/src/Admin/View/Templates/WPGraphQLLoggerView.php

@@ -33,7 +33,7 @@
 		</a>
 	</div>
 
-	<table class="widefat striped wpgraphql-logging-view-table">
+	<table class="widefat striped wpgraphql-logging-details">
 		<tbody>
 			<tr>
 				<th><?php esc_html_e( 'ID', 'wpgraphql-logging' ); ?></th>