Move setting to Features group and add modal

Plus some additional CSS and stuff.
This commit is contained in:
Tetrakern 2024-10-15 13:41:21 +02:00
parent b4667654af
commit df27508834
4 changed files with 28 additions and 19 deletions

File diff suppressed because one or more lines are too long

View File

@ -472,17 +472,17 @@ function fictioneer_settings_capability_checkbox( $cap, $name, $set ) {
* @param string $label Label of the setting. * @param string $label Label of the setting.
* @param string|null $description Optional. The description below the label. * @param string|null $description Optional. The description below the label.
* @param string|null $help Optional. The text for the helper modal. * @param string|null $help Optional. The text for the helper modal.
* @param string $image Optional. The image for the helper modal. * @param string $figure Optional. Figure (image, etc.) for the helper modal.
*/ */
function fictioneer_settings_label_checkbox( $option, $label, $description = null, $help = null, $image = '' ) { function fictioneer_settings_label_checkbox( $option, $label, $description = null, $help = null, $figure = '' ) {
// Setup // Setup
if ( is_string( $help ) ) { if ( is_string( $help ) ) {
$help = strpos( $help, '<p>' ) !== false ? $help : "<p>{$help}</p>"; $help = strpos( $help, '<p>' ) !== false ? $help : "<p>{$help}</p>";
} }
$help = ! is_string( $help ) ? '' : $help = ! is_string( $help ) ? '' :
'<i class="fa-regular fa-circle-question fcn-help" data-action="fcn-show-help" data-label="' . esc_attr( $label ) . '" data-help="' . esc_attr( $image ) . esc_attr( $help ) . '" data-fcn-dialog-target="fcn-help-modal"></i>'; '<i class="fa-regular fa-circle-question fcn-help" data-action="fcn-show-help" data-label="' . esc_attr( $label ) . '" data-help="' . esc_attr( $figure ) . esc_attr( $help ) . '" data-fcn-dialog-target="fcn-help-modal"></i>';
// Start HTML ---> ?> // Start HTML ---> ?>
<label class="fictioneer-label-checkbox" for="<?php echo $option; ?>"> <label class="fictioneer-label-checkbox" for="<?php echo $option; ?>">

View File

@ -382,16 +382,6 @@ $images = get_template_directory_uri() . '/img/documentation/';
?> ?>
</div> </div>
<div class="fictioneer-card__row">
<?php
fictioneer_settings_label_checkbox(
'fictioneer_generate_footnotes_from_tooltips',
__( 'Generate footnotes from tooltips', 'fictioneer' ),
__( 'Show footnotes at the end of the post content based on the tooltips.', 'fictioneer' )
);
?>
</div>
<div class="fictioneer-card__row fictioneer-card__row--inline-input"> <div class="fictioneer-card__row fictioneer-card__row--inline-input">
<p class="fictioneer-inline-text-input"><?php <p class="fictioneer-inline-text-input"><?php
printf( printf(
@ -685,6 +675,23 @@ $images = get_template_directory_uri() . '/img/documentation/';
?> ?>
</div> </div>
<div class="fictioneer-card__row">
<?php
fictioneer_settings_label_checkbox(
'fictioneer_generate_footnotes_from_tooltips',
__( 'Enable footnotes from tooltips', 'fictioneer' ),
__( 'Generate and show footnotes at the end of the post content based on the tooltips.', 'fictioneer' ),
__( '<p>With this feature enabled, tooltips added with the <code>[fcnt]text[/fcnt]</code> shortcode are collected and appended to the content as footnotes, complete with anchor links.</p>', 'fictioneer' ),
'<code class="helper-modal-code">' .
_x(
'[fcnt header="Optional" content="Tooltip content."]text[/fcnt]',
'Settings helper modal tooltip shortcode figure.',
'fictioneer' ) .
'</code>'
);
?>
</div>
<div class="fictioneer-card__row"> <div class="fictioneer-card__row">
<?php <?php
fictioneer_settings_label_checkbox( fictioneer_settings_label_checkbox(

View File

@ -1260,11 +1260,7 @@ a[data-fcn-dialog-target] {
cursor: pointer; cursor: pointer;
} }
.helper-modal-image { :is(.helper-modal-code, .helper-modal-image) {
padding: 1.5px;
border: 1px solid currentColor;
border-radius: 3px;
&:not(:first-child) { &:not(:first-child) {
margin-top: .75em; margin-top: .75em;
} }
@ -1272,6 +1268,12 @@ a[data-fcn-dialog-target] {
&:not(:last-child) { &:not(:last-child) {
margin-bottom: .75em; margin-bottom: .75em;
} }
}
.helper-modal-image {
padding: 1.5px;
border: 1px solid currentColor;
border-radius: 3px;
img { img {
display: block; display: block;