#macro (sizeStyles $height $width $margin $padding)
	#if ($width) width:$width; #end
	#if ($height) height:$height; #end
	#if ($margin && !$mobile) margin:$margin; #end
	#if ($padding) padding:$padding; #end
#end

#macro (backgroundStyles $background-color $background-image-theme $background-image $background-position $background-repeat $background-size $gradient-top-color $gradient-bottom-color $gradient-top $gradient-bottom)
	#if ($background-color)
		background-color:$background-color;
	#end
	#if ($background-image-theme)
		background-image:url($brikitCore.directURL/designs/themes/$brikitCore.urlEncode($themePress.themeName($space.key))/images/$brikitCore.urlEncode($background-image-theme));
	#end
	#if ($background-image)
		background-image:url($brikitCore.contextPath/download/attachments/$page.id/$brikitCore.urlEncode($background-image));
	#end
	#if ($background-position)
		background-position:$background-position;
	#end
	#if ($background-repeat)
		background-repeat:$background-repeat;
	#end
	#if ($brikitCore.isSet($background-size))
		background-size: $!background-size;
	#end
	#if ($brikitCore.isSet($gradient-top-color))
		#if (!$gradient-top)    #set ($gradient-top    = "0") #end
		#if (!$gradient-bottom) #set ($gradient-bottom = "100") #end
		#if ($gradient-top.indexOf("%") == -1) #set ($gradient-top = "${gradient-top}%") #end
		#if ($gradient-bottom.indexOf("%") == -1) #set ($gradient-bottom = "${gradient-bottom}%") #end
		background-image: -webkit-gradient(linear, left $gradient-top, left $gradient-bottom, from($gradient-top-color), to($gradient-bottom-color));
		background-image: -webkit-linear-gradient(to bottom, $gradient-top-color $!gradient-top, $gradient-bottom-color $!gradient-bottom);
		background-image:    -moz-linear-gradient(to bottom, $gradient-top-color $!gradient-top, $gradient-bottom-color $!gradient-bottom);
		background-image:      -o-linear-gradient(to bottom, $gradient-top-color $!gradient-top, $gradient-bottom-color $!gradient-bottom);
		background-image:         linear-gradient(to bottom, $gradient-top-color $!gradient-top, $gradient-bottom-color $!gradient-bottom);
	#end
#end

#macro (borderStyles $border-width $border-style $border-color $border-radius)
	#if ($border-width) border-width: $border-width; #end
	#if ($border-style) border-style: $border-style; #end
	#if ($border-color) border-color: $border-color; #end
	#if ($border-radius) border-radius: $border-radius; #end
#end

#macro (boxShadowStyles $box-shadow)
	#if ($box-shadow) box-shadow: $box-shadow; #end
#end

#macro (pageElementTextField $label $container $property $extraClass $params $forContainer)
	#set ($lookupKey = "#if($forContainer)container-#{end}$property")
	#designerTextField($label $property "${container}-${property}" "text" $extraClass $params.get($lookupKey))
#end

#macro (pageElementSelectField $label $container $property $options $extraClass $params $forContainer)
	#set ($lookupKey = "#if($forContainer)container-#{end}$property")
	#designerSelectField($label $property "${container}-${property}" $options $extraClass $params.get($lookupKey))
#end

#macro (pageElementCheckbox $label $container $property $extraClass $params)
	#designerCheckbox($label $property	"${container}-${property}"	$extraClass $params.get($property))
#end

#macro (pageElementColorPicker $label $container $property $extraClass $params $forContainer)
	#set ($lookupKey = "#if($forContainer)container-#{end}$property")
	#designerColorPicker($label $property	"${container}-${property}"	false $extraClass $params.get($lookupKey))
#end

#macro (pageElementAttachedImageThumbnail $image $height $width)
	#imageURLThumbnail("$brikitCore.contextPath/download/thumbnails/$page.id/$brikitCore.urlEncode($image)" $height $width)
#end

#macro (pageElementImageSelectField $label $container $property $extraClass $params $forContainer)
	#set ($imageValue = false) ## Needed to reset between calls
	#set ($lookupKey = "#if($forContainer)container-#{end}$property")
	#set ($imageValue = $params.get($lookupKey))
	#designerURLImageSelectField($label $property "${container}-${property}"	"theme-image $!extraClass reload-page" $imageValue "$brikitCore.directURL/designs/themes/$brikitCore.urlEncode($themePress.themeName($spaceKey))/images/$brikitCore.urlEncode($imageValue)")
#end

#macro (pageElementAttachedImageSelectField $label $container $property $extraClass $params $forContainer)
	#set ($imageValue = false) ## Needed to reset between calls
	#set ($lookupKey = "#if($forContainer)container-#{end}$property")
	#set ($imageValue = $params.get($lookupKey))
	#designerURLImageSelectField($label $property "${container}-${property}"	"attached-image $!extraClass reload-page" $imageValue "$brikitCore.contextPath/download/thumbnails/$page.id/$brikitCore.urlEncode($imageValue)")
#end

#macro (sizeOptionMacroParameters $container $params $extraClass)
	#pageElementTextField("Width"	$container	"width"	$extraClass	$params)
#end

#macro (boxOptionMacroParameters $container $params $extraClass)
	#pageElementTextField("Margin" 	$container	"margin"	$extraClass	$params)
	#pageElementTextField("Padding" $container	"padding"	$extraClass	$params)
#end

#macro (backgroundOptionMacroParameters $container $addGradient $params $forContainer $extraClass)
	#pageElementColorPicker("Color" 						$container	"background-color"			$extraClass	$params	$forContainer)
	#pageElementImageSelectField("Image from Theme" 		$container	"background-image-theme"	$extraClass	$params	$forContainer)
	#pageElementAttachedImageSelectField("Image from Page" 	$container	"background-image"			$extraClass	$params	$forContainer)
	#pageElementTextField("Image Position" 					$container	"background-position"		$extraClass	$params	$forContainer)
	#pageElementSelectField("Image Repeat" 					$container	"background-repeat" ["", "repeat", "repeat-x", "repeat-y", "no-repeat"] $extraClass	$params $forContainer)
	#pageElementTextField("Image Size"					$container	"background-size"			$extraClass $params $forContainer)
	#if ($addGradient)
		<h5>Gradient</h5>
		#pageElementColorPicker("Top Color" 	$container	"gradient-top-color"	$extraClass	$params	$forContainer)
		#pageElementColorPicker("Bottom Color"	$container	"gradient-bottom-color"	$extraClass	$params	$forContainer)
		#pageElementTextField("Start" 		 	$container	"gradient-top"			$extraClass	$params	$forContainer)
		#pageElementTextField("Stop" 			$container	"gradient-bottom"		$extraClass	$params	$forContainer)
	#end
#end

#macro (borderOptionMacroParameters $container $addRadius $addShadow $params $forContainer $extraClass)
	#pageElementTextField("Width" 		$container	"border-width"		$extraClass	$params	$forContainer)
	#pageElementSelectField("Style" 	$container	"border-style"	["", "solid", "dotted", "dashed", "double"] $extraClass	$params	$forContainer)
	#pageElementColorPicker("Color" 	$container	"border-color"		$extraClass	$params	$forContainer)
	#if ($addRadius)
		#pageElementTextField("Corner Radius" 	$container	"border-radius"	$extraClass	$params	$forContainer)
	#end
	#if ($addShadow)
		#pageElementTextField("Shadow Values" 	$container	"box-shadow"	$extraClass	$params	$forContainer)
	#end
#end