37 lines
1.3 KiB
PHP
37 lines
1.3 KiB
PHP
<?php
|
|
/**
|
|
* Aura Background Partial — Carbon Blue
|
|
*
|
|
* Renders three decorative layers (linear gradient, radial backlight, SVG
|
|
* grain) over a transparent container. The body carries `background-color:
|
|
* #100e0b`; do NOT set a background on this container or the blend modes
|
|
* will composite against the container instead of the page.
|
|
*
|
|
* All layers are aria-hidden and ignore pointer events. Content must sit
|
|
* inside a wrapper with `position: relative; z-index: 1`.
|
|
*
|
|
* @package KsPortfolio
|
|
*/
|
|
|
|
namespace KsPortfolio;
|
|
|
|
$blur = isset( $blur ) && 'desktop' === $blur ? 'aura-layer-2--desktop' : 'aura-layer-2--mobile';
|
|
?>
|
|
<div class="aura-bg" aria-hidden="true">
|
|
<div class="aura-layer-1"></div>
|
|
<div class="aura-layer-2 <?php echo esc_attr( $blur ); ?>"></div>
|
|
<div class="aura-grain">
|
|
<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
|
|
<filter id="aura-grain-filter">
|
|
<feTurbulence type="fractalNoise" baseFrequency="0.7" numOctaves="4" stitchTiles="stitch" />
|
|
<feColorMatrix type="matrix"
|
|
values="0.181 0.608 0.061 0 0.075
|
|
0.181 0.608 0.061 0 0.075
|
|
0.181 0.608 0.061 0 0.075
|
|
0 0 0 1 0" />
|
|
</filter>
|
|
<rect width="100%" height="100%" filter="url(#aura-grain-filter)" />
|
|
</svg>
|
|
</div>
|
|
</div>
|