n0sz/commonmark-picture-extension

Adds support of picture tags to CommonMark PHP implementation

v0.0.1-alpha 2022-10-09 14:59 UTC

Requires

• league/commonmark: ^2.3

Requires (Dev)

• phpunit/phpunit: ^9.5

MIT

• noah1400

README

This library adds support of <picture> tags to league/commonmark

Installation

This project can be install via composer:

composer require n0sz/commonmark-picture-extension

Usage

use League\CommonMark\Environment\Environment;
use League\CommonMark\Extension\CommonMark\CommonMarkCoreExtension;
use N0sz\CommonMark\Picture\PictureExtension;

$environment = new Environment();
$environment->addExtension(new CommonMarkCoreExtension());
$environment->addExtension(new PictureExtension());

Syntax

Code:

[[[
+ img_1 {media:"(min-width:650px)"}
+ img_2 {media:"(min-width:465px)"}
- img_3
]]]

Result:

<picture>
<source media="(min-width:650px)" srcset="img_1" />
<source media="(min-width:465px)" srcset="img_2" />
<img src="img_3" />
</picture>