add element icons

This commit is contained in:
Yisroel Baum 2026-05-27 21:14:24 +03:00
parent ac7af2463d
commit f3f500d491
Signed by: yisroelbaum
GPG key ID: 0FA60884F75520A9
12 changed files with 49 additions and 0 deletions

View file

@ -46,6 +46,7 @@ class ElementController
'id' => $element->getId(),
'title' => $element->getTitle(),
'description' => $element->getDescription(),
'iconImageUrl' => $element->getIconImageUrl(),
'richText' => $element->getRichText(),
'pdfPath' => $element->getPdfPath(),
'youtubeUrl' => $element->getYoutubeUrl(),

View file

@ -10,6 +10,7 @@ class CreateElementDto
public Set $set,
public string $title,
public string $description,
public ?string $iconImageUrl,
public string $richText,
public ?string $pdfPath,
public ?string $youtubeUrl,

View file

@ -10,6 +10,7 @@ class Element
private int $id,
private string $title,
private string $description,
private ?string $iconImageUrl,
private string $richText,
private ?string $pdfPath,
private ?string $youtubeUrl,
@ -33,6 +34,11 @@ class Element
return $this->description;
}
public function getIconImageUrl(): ?string
{
return $this->iconImageUrl;
}
public function getRichText(): string
{
return $this->richText;

View file

@ -10,6 +10,7 @@ use Illuminate\Database\Eloquent\Model;
* @property int $set_id
* @property string $title
* @property string $description
* @property string|null $icon_image_url
* @property string $rich_text
* @property string|null $pdf_path
* @property string|null $youtube_url
@ -23,6 +24,7 @@ use Illuminate\Database\Eloquent\Model;
* @method static Builder<static>|ElementModel whereSetId($value)
* @method static Builder<static>|ElementModel whereTitle($value)
* @method static Builder<static>|ElementModel whereDescription($value)
* @method static Builder<static>|ElementModel whereIconImageUrl($value)
* @method static Builder<static>|ElementModel whereRichText($value)
* @method static Builder<static>|ElementModel wherePdfPath($value)
* @method static Builder<static>|ElementModel whereYoutubeUrl($value)
@ -39,6 +41,7 @@ class ElementModel extends Model
'set_id',
'title',
'description',
'icon_image_url',
'rich_text',
'pdf_path',
'youtube_url',

View file

@ -18,6 +18,7 @@ class EloquentElementRepository implements ElementRepository
'set_id' => $dto->set->getId(),
'title' => $dto->title,
'description' => $dto->description,
'icon_image_url' => $dto->iconImageUrl,
'rich_text' => $dto->richText,
'pdf_path' => $dto->pdfPath,
'youtube_url' => $dto->youtubeUrl,
@ -28,6 +29,7 @@ class EloquentElementRepository implements ElementRepository
id: $model->id,
title: $dto->title,
description: $dto->description,
iconImageUrl: $dto->iconImageUrl,
richText: $dto->richText,
pdfPath: $dto->pdfPath,
youtubeUrl: $dto->youtubeUrl,
@ -111,6 +113,7 @@ class EloquentElementRepository implements ElementRepository
id: $model->id,
title: $model->title,
description: $model->description,
iconImageUrl: $model->icon_image_url,
richText: $model->rich_text,
pdfPath: $model->pdf_path,
youtubeUrl: $model->youtube_url,

View file

@ -31,6 +31,9 @@ class CreateElement
throw new BadRequestException('title is required');
}
$description = $request->description ?? '';
$iconImageUrl = $request->iconImageUrl === ''
? null
: $request->iconImageUrl;
$richText = $request->richText ?? '';
$pdfPath = $request->pdfPath === '' ? null : $request->pdfPath;
$youtubeUrl = $request->youtubeUrl === ''
@ -51,6 +54,7 @@ class CreateElement
set: $set,
title: $request->title,
description: $description,
iconImageUrl: $iconImageUrl,
richText: $richText,
pdfPath: $pdfPath,
youtubeUrl: $youtubeUrl,
@ -76,6 +80,7 @@ class CreateElement
set: $set,
title: $request->title,
description: $description,
iconImageUrl: $iconImageUrl,
richText: $richText,
pdfPath: $pdfPath,
youtubeUrl: $youtubeUrl,

View file

@ -8,6 +8,7 @@ class CreateElementRequest
public ?int $setId,
public ?string $title,
public ?string $description,
public ?string $iconImageUrl,
public ?string $richText,
public ?string $pdfPath,
public ?string $youtubeUrl,

View file

@ -13,6 +13,7 @@ return new class extends Migration
$table->foreignId('set_id')->constrained('sets');
$table->string('title');
$table->text('description')->default('');
$table->string('icon_image_url')->nullable();
$table->text('rich_text')->default('');
$table->string('pdf_path')->nullable();
$table->string('youtube_url')->nullable();

View file

@ -18,6 +18,7 @@ class ElementSeeder extends Seeder
set: $baderechSet,
title: $baderechSet->getName(),
description: $baderechSet->getDescription(),
iconImageUrl: '/assets/baderech-haavodah-icon.png',
richText: '<p>Begin with a clear map for avodah growth.</p>'
. '<p><strong>Move steadily</strong> from awareness '
. 'to practice.</p>',
@ -31,6 +32,7 @@ class ElementSeeder extends Seeder
title: 'Avodah Foundations',
description: 'Core foundations for building a steady '
. 'avodah practice.',
iconImageUrl: null,
richText: '<p>Avodah foundations begin with honest awareness '
. 'and small repeatable steps.</p>',
pdfPath: null,
@ -41,6 +43,7 @@ class ElementSeeder extends Seeder
set: $baderechSet,
title: 'Daily Practice',
description: 'Practical steps for consistent daily growth.',
iconImageUrl: null,
richText: '<p>Daily practice turns inspiration into a '
. 'dependable rhythm.</p>',
pdfPath: null,

View file

@ -21,6 +21,7 @@ class FakeElementRepository implements ElementRepository
id: $id,
title: $dto->title,
description: $dto->description,
iconImageUrl: $dto->iconImageUrl,
richText: $dto->richText,
pdfPath: $dto->pdfPath,
youtubeUrl: $dto->youtubeUrl,
@ -100,6 +101,7 @@ class FakeElementRepository implements ElementRepository
id: $element->getId(),
title: $element->getTitle(),
description: $element->getDescription(),
iconImageUrl: $element->getIconImageUrl(),
richText: $element->getRichText(),
pdfPath: $element->getPdfPath(),
youtubeUrl: $element->getYoutubeUrl(),

View file

@ -8,6 +8,7 @@ export interface ChildElement {
}
export interface Element extends ChildElement {
iconImageUrl: string | null
richText: string
pdfPath: string | null
youtubeUrl: string | null

View file

@ -211,6 +211,14 @@ function isShortYoutubeHost(hostname: string): boolean {
{{ error }}
</p>
<section v-else-if="element" class="element-page__content">
<img
v-if="element.iconImageUrl !== null"
:src="element.iconImageUrl"
:alt="`${element.title} icon`"
class="element-page__icon"
data-cy="element-icon"
/>
<h1 class="element-page__heading">
{{ element.title }}
</h1>
@ -296,6 +304,14 @@ function isShortYoutubeHost(hostname: string): boolean {
margin: 0 auto;
}
.element-page__icon {
display: block;
width: 132px;
height: 132px;
margin: 0 auto 1.8rem;
object-fit: contain;
}
.element-page__heading {
margin: 0;
color: #2c2c2c;
@ -459,5 +475,11 @@ function isShortYoutubeHost(hostname: string): boolean {
.element-page__children {
margin-top: 2rem;
}
.element-page__icon {
width: 108px;
height: 108px;
margin-bottom: 1.4rem;
}
}
</style>