README

包装Pantone Converter以提供显示颜色样本的Twig函数

安装

使用composer要求该扩展包

composer require matatirosoln/pantone-converter-bundle

启用该扩展包，对于Flex

// in config/bundles.php
return [
	// ...
	MSDev\PantoneConverterBundle\PantoneConverterBundle::class => ['all' => true],
];

或者对于Symfony 3.4

// in app/AppKernel.php
public function registerBundles() {
	$bundles = [
		// ...
		new MSDev\PantoneConverterBundle\PantoneConverterBundle(),
	];
	// ...
}

使用方法

基本使用

在Twig模板中使用pantone_swatch，传入所需的颜色作为参数，例如：

{{ pantone_swatch('100 C') }} 

将渲染以下HTML：

<span class="pantone-swatch" style="background-color:#F6EB61;"></span>

然后，您需要为pantone-swatch类应用样式，以显示适当的尺寸，例如：

.pantone-swatch {
    display: inline-block;
    width: 50px;
    height: 50px;
}

错误情况

如果您请求一个不存在的颜色，样本将以白色背景渲染，例如：

{{ pantone_swatch('Foo C', 'This colour is missing') }} 

将渲染以下HTML：

<span class="pantone-swatch" style="background-color:#FFFFFF;">This colour is missing</span>

选项

您还可以将一个可选对象作为第二个参数传递，包含三个可能的值。

内容

向span添加内容（这可以包括HTML），例如：

{{ pantone_swatch('100 C', {'content': 'This is yellow'}) }} 

将渲染以下HTML：

<span class="pantone-swatch" style="background-color:#F6EB61;">This is yellow</span>

边框

向样本添加指定颜色的边框。这可以是HTML命名颜色或十六进制颜色，例如：

{{ pantone_swatch('100 C', {'border': '#FF0000'}) }} 

将渲染以下HTML：

<span class="pantone-swatch" style="background-color:#F6EB61;border-color:#FF0000"></span>

您需要在CSS中设置其他边框参数，例如：

.pantone-swatch {
    /*...*/
    border-width: 1px;
    border-style: solid;
}

白色时的边框

向样本添加指定颜色的边框，但仅当它是白色时。这可能会发生，如果样本故意设置为白色，或者当传递无效颜色时。这可以是HTML命名颜色或十六进制颜色，例如：

{{ pantone_swatch('100 C', {'borderWhite': '#FF0000'}) }} 

将渲染以下HTML：

<span class="pantone-swatch" style="background-color:#F6EB61;"></span>

因为100 C是有效的颜色，而

{{ pantone_swatch('Unknown Colour', {'borderWhite': '#FF0000'}) }} 

将渲染以下HTML：

<span class="pantone-swatch" style="background-color:#F6EB61;border-color:#FF0000"></span>

对于标准边框，您还需要在CSS中设置其他边框参数。

许可证

版权所有 © 2020，Matatiro Solutions。在MIT许可证下发布。MIT许可证。

注意

• PANTONE®是Pantone Inc的注册商标。Pantone Inc。