Move inline CSS to stylesheet for site block details

Move the inline styles for the collapsible details/summary elements
to activitypub-admin.css instead of using inline styles in PHP.

Author: obenland

assets/css/activitypub-admin.css

@@ -104,6 +104,25 @@ summary {
 	color: #2271b1;
 }
 
+.activitypub-site-block-details {
+	margin: 10px 0;
+}
+
+.activitypub-site-block-details summary {
+	padding: 8px 0;
+	color: inherit;
+	text-decoration: none;
+}
+
+.activitypub-site-block-details table {
+	max-width: 500px;
+	margin-top: 10px;
+}
+
+.activitypub-site-block-details td:last-child {
+	width: 80px;
+}
+
 .activitypub-settings-accordion {
 	border: 1px solid #c3c4c7;
 }

includes/wp-admin/class-settings-fields.php

@@ -435,8 +435,8 @@ public static function render_site_blocked_domains_field() {
 
 		<div class="activitypub-site-block-list">
 			<?php if ( ! empty( $blocked_domains ) ) : ?>
-			<details style="margin: 10px 0;">
-				<summary style="cursor: pointer; padding: 8px 0; color: inherit;">
+			<details class="activitypub-site-block-details">
+				<summary>
 					<?php
 					echo \esc_html(
 						\sprintf(
@@ -447,11 +447,11 @@ public static function render_site_blocked_domains_field() {
 					);
 					?>
 				</summary>
-				<table class="widefat striped activitypub-site-blocked-domain" role="presentation" style="max-width: 500px; margin-top: 10px;">
+				<table class="widefat striped activitypub-site-blocked-domain" role="presentation">
 					<?php foreach ( $blocked_domains as $domain ) : ?>
 						<tr>
 							<td><?php echo \esc_html( $domain ); ?></td>
-							<td style="width: 80px;">
+							<td>
 								<button type="button" class="button button-small remove-site-block-btn" data-type="domain" data-value="<?php echo \esc_attr( $domain ); ?>">
 									<?php \esc_html_e( 'Remove', 'activitypub' ); ?>
 								</button>
@@ -483,8 +483,8 @@ public static function render_site_blocked_keywords_field() {
 
 		<div class="activitypub-site-block-list">
 			<?php if ( ! empty( $blocked_keywords ) ) : ?>
-			<details style="margin: 10px 0;">
-				<summary style="cursor: pointer; padding: 8px 0; color: inherit;">
+			<details class="activitypub-site-block-details">
+				<summary>
 					<?php
 					echo \esc_html(
 						\sprintf(
@@ -495,11 +495,11 @@ public static function render_site_blocked_keywords_field() {
 					);
 					?>
 				</summary>
-				<table class="widefat striped activitypub-site-blocked-keyword" role="presentation" style="max-width: 500px; margin-top: 10px;">
+				<table class="widefat striped activitypub-site-blocked-keyword" role="presentation">
 					<?php foreach ( $blocked_keywords as $keyword ) : ?>
 						<tr>
 							<td><?php echo \esc_html( $keyword ); ?></td>
-							<td style="width: 80px;">
+							<td>
 								<button type="button" class="button button-small remove-site-block-btn" data-type="keyword" data-value="<?php echo \esc_attr( $keyword ); ?>">
 									<?php \esc_html_e( 'Remove', 'activitypub' ); ?>
 								</button>