sascha fuchs gisu

## image.vue
<template>
  <figure
    class="eg-image relative"
    @clicks="clickTransfer()"
  >
    <div
      :class="[bgColorClass, { 'h-full w-full': background, rounded, 'skeleton': showSkeleton}]"
      :style="[presized ? styleObject : '']"
    >
      <no-ssr>

## cssgrid-area.scss
/// Generate Coordinates based on Grid Matrix and the selected area
///
/// @group core - cssgrid
///
/// @param   {string}  $area - Name of the Area
/// @param   {map}     $map - Map of your grid area matrix
/// @param   {bool}    $columnGap - If you use Gap for Columns
/// @param   {bool}    $rowGap - If you use Gap for Rows
///
/// @example scss - scss

## cssgrid-matrix.scss
/// Generate a Grid Template Area from a Grid Map
///
/// @group core - cssgrid
///
/// @param   {string}  $area - Name of the Area
/// @param   {map}     $map - Map of your grid area matrix
///
/// @example scss - scss
///    $gridAreaMap: (
///      row1: ('logo', 'nav', 'nav', 'nav'),

## cssgrid-columandrow.scss
/// Add Gap between the boxes
///
/// @group core - cssgrid
///
/// @param   {list}    $boxes - List with box sizes
/// @param   {string}  $gap - Optional column gap
@function box-gap($boxes, $gap) {
  $box: ();

  @for $i from 1 through length($boxes) {

## _cssgrid.scss
// ===================================================
// CSS Grid Layout Helper
//
// To convert some of the CSS Grid Spec 2 features to Spec 1
//
// Author: Sascha Fuchs
//
// ===================================================

/// Add Gap between the boxes

## macroMediaImageSet.php
<?php
/**
 * Media Image Set Reference
 * =========================
 * Generate a Media Image Set for Lazyload in different formats. It references to
 * the defined Images Sizes, to make it Smarter
 *
 * @param {object} $image      = Image (Uses a ACF Image Array)
 * @param {string} $classname  = Classname from the Element
 * @param {string} $format     = Imageformat [uncropped, wide, extrawide, square, rect]

## imagesizes.php
<?php
/**
  Image Sizes
  ===========
  Build a Set of different Imagesets
  Part of your function.php
 */

// Uncopped Image Sizes
$UNCROPPED_SIZES = [

## img.html

{# ================================================================== #}
{# ================================================================== #}
{# Responsive Images
{# ================================================================== #}
{# ================================================================== #}
{#
   {% import '_macros/img' as macroImg %}
   Macro to centralize the markup and config for responsive images.


## Multienvironment Worpdress.txt
Include a directory in your Theme folder with the name `wp-config` and include here the File for your Environment.

## SassMeister-input-HTML.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
<div class="container">
  <div class="left"></div>
  <div class="right"></div>
	<template>
	<figure
	class="eg-image relative"
	@clicks="clickTransfer()"
	>
	<div
	:class="[bgColorClass, { 'h-full w-full': background, rounded, 'skeleton': showSkeleton}]"
	:style="[presized ? styleObject : '']"
	>
	<no-ssr>
	/// Generate Coordinates based on Grid Matrix and the selected area
	///
	/// @group core - cssgrid
	///
	/// @param {string} $area - Name of the Area
	/// @param {map} $map - Map of your grid area matrix
	/// @param {bool} $columnGap - If you use Gap for Columns
	/// @param {bool} $rowGap - If you use Gap for Rows
	///
	/// @example scss - scss
	/// Generate a Grid Template Area from a Grid Map
	///
	/// @group core - cssgrid
	///
	/// @param {string} $area - Name of the Area
	/// @param {map} $map - Map of your grid area matrix
	///
	/// @example scss - scss
	/// $gridAreaMap: (
	/// row1: ('logo', 'nav', 'nav', 'nav'),
	/// Add Gap between the boxes
	///
	/// @group core - cssgrid
	///
	/// @param {list} $boxes - List with box sizes
	/// @param {string} $gap - Optional column gap
	@function box-gap($boxes, $gap) {
	$box: ();

	@for $i from 1 through length($boxes) {
	// ===================================================
	// CSS Grid Layout Helper
	//
	// To convert some of the CSS Grid Spec 2 features to Spec 1
	//
	// Author: Sascha Fuchs
	//
	// ===================================================

	/// Add Gap between the boxes
	<?php
	/**
	* Media Image Set Reference
	* =========================
	* Generate a Media Image Set for Lazyload in different formats. It references to
	* the defined Images Sizes, to make it Smarter
	*
	* @param {object} $image = Image (Uses a ACF Image Array)
	* @param {string} $classname = Classname from the Element
	* @param {string} $format = Imageformat [uncropped, wide, extrawide, square, rect]
	<?php
	/**
	Image Sizes
	===========
	Build a Set of different Imagesets
	Part of your function.php
	*/

	// Uncopped Image Sizes
	$UNCROPPED_SIZES = [

	{# ================================================================== #}
	{# ================================================================== #}
	{# Responsive Images
	{# ================================================================== #}
	{# ================================================================== #}
	{#
	{% import '_macros/img' as macroImg %}
	Macro to centralize the markup and config for responsive images.
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>JS Bin</title>
	</head>
	<body>
	<div class="container">
	<div class="left"></div>
	<div class="right"></div>