fix(xml-editor): escape xml editor's content + restyle form sections to prevent overflowing

This commit is contained in:
Yassine Doghri 2022-01-23 16:53:23 +00:00
parent 99bb40b8bc
commit 588590bd2c
15 changed files with 32 additions and 26 deletions

View File

@ -16,13 +16,13 @@ class Section extends Component
public function render(): string
{
$subtitle = $this->subtitle === null ? '' : '<p class="text-sm clear-left text-skin-muted ' . $this->subtitleClass . '">' . $this->subtitle . '</p>';
$subtitle = $this->subtitle === null ? '' : '<p class="text-sm text-skin-muted ' . $this->subtitleClass . '">' . $this->subtitle . '</p>';
return <<<HTML
<fieldset class="w-full p-8 bg-elevated border-3 border-subtle rounded-xl {$this->class}">
<fieldset class="w-full p-8 bg-elevated border-3 flex flex-col items-start border-subtle rounded-xl {$this->class}">
<Heading tagName="legend" class="float-left">{$this->title}</Heading>
{$subtitle}
<div class="flex flex-col gap-4 py-4 clear-left">{$this->slot}</div>
<div class="flex flex-col w-0 min-w-full gap-4 py-4">{$this->slot}</div>
</fieldset>
HTML;
}

View File

@ -14,11 +14,17 @@ class XMLEditor extends FormComponent
'class' => 'textarea',
];
protected string $content = '';
public function setContent(string $value): void
{
$this->content = htmlspecialchars_decode($value);
}
public function render(): string
{
$content = $this->slot;
$this->attributes['slot'] = 'textarea';
$textarea = form_textarea($this->attributes, $content);
$textarea = form_textarea($this->attributes, $this->content);
return <<<HTML
<xml-editor>{$textarea}</time-ago>

View File

@ -26,7 +26,7 @@
<dt class="text-sm font-medium leading-5 text-skin-muted">
<?= lang('User.form.permissions') ?>
</dt>
<dd class="max-w-xl mt-1 text-sm leading-5">
<dd class="w-full max-w-xl mt-1 text-sm leading-5">
<?= implode(', ', $user->permissions) ?>
</dd>
</div>

View File

@ -11,7 +11,7 @@
<?= $this->section('content') ?>
<form action="<?= route_to('episode-create', $podcast->id) ?>" method="POST" enctype="multipart/form-data" class="flex flex-col max-w-xl mt-6 gap-y-8">
<form action="<?= route_to('episode-create', $podcast->id) ?>" method="POST" enctype="multipart/form-data" class="flex flex-col w-full max-w-xl mt-6 gap-y-8">
<?= csrf_field() ?>
@ -53,14 +53,14 @@
<div class="flex flex-col gap-x-2 gap-y-4 md:flex-row">
<Forms.Field
class="flex-1 w-0"
class="flex-1 w-full"
name="season_number"
label="<?= lang('Episode.form.season_number') ?>"
type="number"
value="<?= $currentSeasonNumber ?>"
/>
<Forms.Field
class="flex-1 w-0"
class="flex-1 w-full"
name="episode_number"
label="<?= lang('Episode.form.episode_number') ?>"
type="number"

View File

@ -10,7 +10,7 @@
<?= $this->section('content') ?>
<form action="<?= route_to('episode-delete', $podcast->id, $episode->id) ?>" method="POST" class="flex flex-col max-w-xl mx-auto">
<form action="<?= route_to('episode-delete', $podcast->id, $episode->id) ?>" method="POST" class="flex flex-col w-full max-w-xl mx-auto">
<?= csrf_field() ?>
<Alert variant="danger" glyph="alert" class="font-semibold"><?= lang('Episode.delete_form.disclaimer') ?></Alert>

View File

@ -15,7 +15,7 @@
<?= $this->section('content') ?>
<form id="episode-edit-form" action="<?= route_to('episode-edit', $podcast->id, $episode->id) ?>" method="POST" enctype="multipart/form-data" class="flex flex-col max-w-xl mt-6 gap-y-8">
<form id="episode-edit-form" action="<?= route_to('episode-edit', $podcast->id, $episode->id) ?>" method="POST" enctype="multipart/form-data" class="flex flex-col w-full max-w-xl mt-6 gap-y-8">
<?= csrf_field() ?>
@ -57,14 +57,14 @@
<div class="flex flex-col gap-x-2 gap-y-4 md:flex-row">
<Forms.Field
class="flex-1 w-0"
class="flex-1 w-full"
name="season_number"
label="<?= lang('Episode.form.season_number') ?>"
type="number"
value="<?= $episode->season_number ?>"
/>
<Forms.Field
class="flex-1 w-0"
class="flex-1 w-full"
name="episode_number"
label="<?= lang('Episode.form.episode_number') ?>"
type="number"
@ -267,7 +267,7 @@
name="custom_rss"
label="<?= lang('Episode.form.custom_rss') ?>"
hint="<?= lang('Episode.form.custom_rss_hint') ?>"
value="<?= $episode->custom_rss_string ?>"
content="<?= esc($episode->custom_rss_string) ?>"
/>
</Forms.Section>

View File

@ -24,7 +24,7 @@
<?php endforeach; ?>
</div>
<iframe name="embed" id="embed" class="w-full max-w-xl mt-6 h-36" frameborder="0" scrolling="no" style="width: 100%; overflow: hidden;" src="<?= $episode->embed_url ?>"></iframe>
<iframe name="embed" id="embed" class="w-full max-w-xl mt-6 h-28" frameborder="0" scrolling="no" style="width: 100%; overflow: hidden;" src="<?= $episode->embed_url ?>"></iframe>
<div class="flex items-center mt-8 gap-x-2">
<Forms.Textarea readonly="true" class="w-full max-w-xl" name="iframe" rows="2" value="<?= esc("<iframe width=\"100%\" height=\"280\" frameborder=\"0\" scrolling=\"no\" style=\"width: 100%; height: 280px; overflow: hidden;\" src=\"{$episode->embed_url}\"></iframe>") ?>" />

View File

@ -18,7 +18,7 @@
],
) ?>
<form action="<?= route_to('episode-publish', $podcast->id, $episode->id) ?>" method="POST" class="flex flex-col items-start max-w-xl mx-auto" data-submit="validate-message">
<form action="<?= route_to('episode-publish', $podcast->id, $episode->id) ?>" method="POST" class="flex flex-col items-start w-full max-w-lg mx-auto mt-4" data-submit="validate-message">
<?= csrf_field() ?>
<input type="hidden" name="client_timezone" value="UTC" />

View File

@ -18,7 +18,7 @@
],
) ?>
<form action="<?= route_to('episode-publish_edit', $podcast->id, $episode->id) ?>" method="POST" class="flex flex-col items-start max-w-xl mx-auto" data-submit="validate-message">
<form action="<?= route_to('episode-publish_edit', $podcast->id, $episode->id) ?>" method="POST" class="flex flex-col items-start w-full max-w-lg mx-auto mt-4" data-submit="validate-message">
<?= csrf_field() ?>
<input type="hidden" name="client_timezone" value="UTC" />
<input type="hidden" name="post_id" value="<?= $post->id ?>" />

View File

@ -10,7 +10,7 @@
<?= $this->section('content') ?>
<form action="<?= route_to('episode-unpublish', $podcast->id, $episode->id) ?>" method="POST" class="flex flex-col max-w-xl mx-auto">
<form action="<?= route_to('episode-unpublish', $podcast->id, $episode->id) ?>" method="POST" class="flex flex-col max-w-lg mx-auto">
<?= csrf_field() ?>
<Alert variant="danger" glyph="alert" class="font-semibold"><?= lang('Episode.unpublish_form.disclaimer') ?></Alert>

View File

@ -14,7 +14,7 @@
<?= $this->section('content') ?>
<form action="<?= route_to('podcast-create') ?>" method="POST" enctype='multipart/form-data' class="flex flex-col max-w-xl gap-y-6">
<form action="<?= route_to('podcast-create') ?>" method="POST" enctype='multipart/form-data' class="flex flex-col w-full max-w-xl gap-y-6">
<?= csrf_field() ?>
<Forms.Section

View File

@ -36,7 +36,7 @@
</div>
</div>
<div class="flex flex-col max-w-xl gap-y-6">
<div class="flex flex-col w-full max-w-xl gap-y-6">
<Forms.Section
title="<?= lang('Podcast.form.identity_section_title') ?>"
@ -217,8 +217,8 @@
as="XMLEditor"
name="custom_rss"
label="<?= lang('Podcast.form.custom_rss') ?>"
value="<?= $podcast->custom_rss_string ?>"
hint="<?= lang('Podcast.form.custom_rss_hint') ?>" />
hint="<?= lang('Podcast.form.custom_rss_hint') ?>"
content="<?= esc($podcast->custom_rss_string) ?>" />
</Forms.Section>

View File

@ -12,7 +12,7 @@
<Alert glyph="alert" variant="danger" class="max-w-xl"><?= lang('PodcastImport.warning') ?></Alert>
<form action="<?= route_to('podcast-import') ?>" method="POST" enctype='multipart/form-data' class="flex flex-col max-w-xl mt-6 gap-y-8">
<form action="<?= route_to('podcast-import') ?>" method="POST" enctype='multipart/form-data' class="flex flex-col w-full max-w-xl mt-6 gap-y-8">
<?= csrf_field() ?>
<Forms.Section

View File

@ -57,7 +57,7 @@
</form>
<form action="<?= route_to('settings-images-regenerate') ?>" method="POST" class="flex flex-col max-w-xl gap-y-4">
<form action="<?= route_to('settings-images-regenerate') ?>" method="POST" class="flex flex-col w-full max-w-xl gap-y-4">
<?= csrf_field() ?>
<Forms.Section
@ -70,7 +70,7 @@
</form>
<form action="<?= route_to('settings-housekeeping-run') ?>" method="POST" class="flex flex-col max-w-xl gap-y-4">
<form action="<?= route_to('settings-housekeeping-run') ?>" method="POST" class="flex flex-col w-full max-w-xl gap-y-4">
<?= csrf_field() ?>
<Forms.Section

View File

@ -10,7 +10,7 @@
<?= $this->section('content') ?>
<form action="<?= route_to('settings-theme') ?>" method="POST" class="flex flex-col max-w-xl gap-y-4" enctype="multipart/form-data">
<form action="<?= route_to('settings-theme') ?>" method="POST" class="flex flex-col w-full max-w-xl gap-y-4" enctype="multipart/form-data">
<?= csrf_field() ?>
<Forms.Section
title="<?= lang('Settings.theme.accent_section_title') ?>"