스킨에서 색상 변수 확인 강화, 링크 텍스트 색상 선명도 증가.

This commit is contained in:
MinSoo Kim 2017-03-03 23:07:39 +09:00
parent 91f11b08d9
commit 60248dabe9
4 changed files with 75 additions and 53 deletions

View file

@ -1,5 +1,18 @@
<load target="js/member.js" /> <load target="js/member.js" />
<!--// Check layout. If it is Simple World, select layout primary colors as a primary color of this skin --> <!--// Check layout. If it is Simple World, select layout primary colors as a primary color of this skin -->
<block cond="$layout_info->extra_var->primary_color->type === 'select' || $layout_info->extra_var->customized_primary_color->type === 'colorpicker'">
{@
if(!$layout_info->primary_color)
$layout_info->primary_color = 'red';
if(!$layout_info->primary_color && $layout_info->customized_primary_color)
$layout_info->primary_color = 'customized';
if(!$layout_info->customized_primary_color)
$layout_info->customized_primary_color = '#f44336';
}
</block>
<block cond="$layout_info->extra_var->primary_color->type !== 'select' && $layout_info->extra_var->customized_primary_color->type !== 'colorpicker'">
{@$layout_info->primary_color = 'red';}
</block>
{@ {@
$material_colors = array( $material_colors = array(
'red' => '#f44336', 'red' => '#f44336',
@ -28,24 +41,21 @@
'customized' => $layout_info->customized_primary_color, 'customized' => $layout_info->customized_primary_color,
); );
} }
<block cond="$layout_info->extra_var->primary_color->type === 'select' || $layout_info->extra_var->customized_primary_color->type === 'colorpicker'">
{@
if(!$layout_info->primary_color && $layout_info->customized_primary_color)
$layout_info->primary_color = 'customized';
if(!$layout_info->primary_color)
$layout_info->primary_color = 'red';
if(!$layout_info->customized_primary_color)
$layout_info->customized_primary_color = '#f44336';
}
</block>
<block cond="$layout_info->extra_var->primary_color->type !== 'select' && $layout_info->extra_var->customized_primary_color->type !== 'colorpicker'">
{@$layout_info->primary_color = 'blue';}
</block>
<!--// Load styles --> <!--// Load styles -->
{@$colorset = $material_colors[$member_config->colorset];} {@$colorset = $material_colors[$member_config->colorset];}
{@$skin_color = $material_colors[$layout_info->primary_color];} {@$skin_color = $material_colors[$layout_info->primary_color];}
<block cond="$colorset">
<!--@if(preg_match("/#([a-f0-9]{3}){1,2}/i", trim($colorset)) && in_array(strlen(trim($colorset)), array(4, 7)))-->
{@$skin_color = trim($colorset)}
<!--@if(strlen(trim($colorset)) === 4)-->
{@$skin_color = trim($colorset)[1].trim($colorset)[1].trim($colorset)[2].trim($colorset)[2].trim($colorset)[3].trim($colorset)[3]}
<!--@endif-->
<!--@else-->
{@$skin_color = '#f44336'}
<!--@endif-->
</block>
<block cond="!$skin_color"> <block cond="!$skin_color">
<!--@if(preg_match("/#([a-f0-9]{3}){1,2}/i", $layout_info->primary_color))--> <!--@if(preg_match("/#([a-f0-9]{3}){1,2}/i", $layout_info->primary_color) && in_array(strlen(trim($colorset)), array(4, 7)))-->
{@$skin_color = $layout_info->primary_color} {@$skin_color = $layout_info->primary_color}
<!--@if(strlen($layout_info->primary_color) === 4)--> <!--@if(strlen($layout_info->primary_color) === 4)-->
{@$skin_color = $layout_info->primary_color[1].$layout_info->primary_color[1].$layout_info->primary_color[2].$layout_info->primary_color[2].$layout_info->primary_color[3].$layout_info->primary_color[3]} {@$skin_color = $layout_info->primary_color[1].$layout_info->primary_color[1].$layout_info->primary_color[2].$layout_info->primary_color[2].$layout_info->primary_color[3].$layout_info->primary_color[3]}
@ -54,9 +64,6 @@
{@$skin_color = '#f44336'} {@$skin_color = '#f44336'}
<!--@endif--> <!--@endif-->
</block> </block>
<block cond="$colorset">
{@$skin_color = $colorset}
</block>
{@Context::set('simple_less_value', array('red' => hexdec(substr($skin_color, 1, 2)), 'green' => hexdec(substr($skin_color, 3, 2)), 'blue' => hexdec(substr($skin_color, 5, 2)) ))} {@Context::set('simple_less_value', array('red' => hexdec(substr($skin_color, 1, 2)), 'green' => hexdec(substr($skin_color, 3, 2)), 'blue' => hexdec(substr($skin_color, 5, 2)) ))}
<load target="css/css.less" vars="$simple_less_value" /> <load target="css/css.less" vars="$simple_less_value" />
<section class="rx_simple_member"> <section class="rx_simple_member">

View file

@ -68,7 +68,7 @@ script, style
.rx_simple_member a .rx_simple_member a
{ {
color: @color; .text-contrast(#fff; darken(@color,5%); lighten(@color,5%));
text-decoration: none; text-decoration: none;
} }
/* Horizontal align */ /* Horizontal align */

View file

@ -1,7 +1,19 @@
<!--// responsible layout --> <!--// responsible layout -->
{@Context::addMetaTag("viewport", "width=device-width, user-scalable=yes")} {@Context::addMetaTag("viewport", "width=device-width, user-scalable=yes")}
<!--// Check layout. If it is Simple World, select layout primary colors as a primary color of this skin --> <!--// Check layout. If it is Simple World, select layout primary colors as a primary color of this skin -->
<block cond="$layout_info->extra_var->primary_color->type === 'select' || $layout_info->extra_var->customized_primary_color->type === 'colorpicker'">
{@
if(!$layout_info->primary_color)
$layout_info->primary_color = 'red';
if(!$layout_info->primary_color && $layout_info->customized_primary_color)
$layout_info->primary_color = 'customized';
if(!$layout_info->customized_primary_color)
$layout_info->customized_primary_color = '#f44336';
}
</block>
<block cond="$layout_info->extra_var->primary_color->type !== 'select' && $layout_info->extra_var->customized_primary_color->type !== 'colorpicker'">
{@$layout_info->primary_color = 'red';}
</block>
{@ {@
$material_colors = array( $material_colors = array(
'red' => '#f44336', 'red' => '#f44336',
@ -30,25 +42,21 @@
'customized' => $layout_info->customized_primary_color, 'customized' => $layout_info->customized_primary_color,
); );
} }
<block cond="$layout_info->extra_var->primary_color->type === 'select' || $layout_info->extra_var->customized_primary_color->type === 'colorpicker'">
{@
if(!$layout_info->primary_color && $layout_info->customized_primary_color)
$layout_info->primary_color = 'customized';
if(!$layout_info->primary_color)
$layout_info->primary_color = 'red';
if(!$layout_info->customized_primary_color)
$layout_info->customized_primary_color = '#f44336';
}
</block>
<block cond="$layout_info->extra_var->primary_color->type !== 'select' && $layout_info->extra_var->customized_primary_color->type !== 'colorpicker'">
{@$layout_info->primary_color = 'blue';}
</block>
<!--// Load styles --> <!--// Load styles -->
{@$colorset = $material_colors[$member_config->colorset];}
{@$skin_color = $material_colors[$layout_info->primary_color];} {@$skin_color = $material_colors[$layout_info->primary_color];}
<block cond="$colorset">
<!--@if(preg_match("/#([a-f0-9]{3}){1,2}/i", trim($colorset)) && in_array(strlen(trim($colorset)), array(4, 7)))-->
{@$skin_color = trim($colorset)}
<!--@if(strlen(trim($colorset)) === 4)-->
{@$skin_color = trim($colorset)[1].trim($colorset)[1].trim($colorset)[2].trim($colorset)[2].trim($colorset)[3].trim($colorset)[3]}
<!--@endif-->
<!--@else-->
{@$skin_color = '#f44336'}
<!--@endif-->
</block>
<block cond="!$skin_color"> <block cond="!$skin_color">
<!--@if(preg_match("/#([a-f0-9]{3}){1,2}/i", $layout_info->primary_color))--> <!--@if(preg_match("/#([a-f0-9]{3}){1,2}/i", $layout_info->primary_color) && in_array(strlen(trim($colorset)), array(4, 7)))-->
{@$skin_color = $layout_info->primary_color} {@$skin_color = $layout_info->primary_color}
<!--@if(strlen($layout_info->primary_color) === 4)--> <!--@if(strlen($layout_info->primary_color) === 4)-->
{@$skin_color = $layout_info->primary_color[1].$layout_info->primary_color[1].$layout_info->primary_color[2].$layout_info->primary_color[2].$layout_info->primary_color[3].$layout_info->primary_color[3]} {@$skin_color = $layout_info->primary_color[1].$layout_info->primary_color[1].$layout_info->primary_color[2].$layout_info->primary_color[2].$layout_info->primary_color[3].$layout_info->primary_color[3]}

View file

@ -1,6 +1,19 @@
<load target="./js/content_widget.js" cond="$widget_info->page_count || count($widget_info->tab)" /> <load target="./js/content_widget.js" cond="$widget_info->page_count || count($widget_info->tab)" />
<!--// Check layout. If it is Simple World, select layout primary colors as a primary color of this skin --> <!--// Check layout. If it is Simple World, select layout primary colors as a primary color of this skin -->
{@$layout_info = Context::get('layout_info')} {@$layout_info = Context::get('layout_info')}
<block cond="$layout_info->extra_var->primary_color->type === 'select' || $layout_info->extra_var->customized_primary_color->type === 'colorpicker'">
{@
if(!$layout_info->primary_color)
$layout_info->primary_color = 'red';
if(!$layout_info->primary_color && $layout_info->customized_primary_color)
$layout_info->primary_color = 'customized';
if(!$layout_info->customized_primary_color)
$layout_info->customized_primary_color = '#f44336';
}
</block>
<block cond="$layout_info->extra_var->primary_color->type !== 'select' && $layout_info->extra_var->customized_primary_color->type !== 'colorpicker'">
{@$layout_info->primary_color = 'red';}
</block>
{@ {@
$material_colors = array( $material_colors = array(
'red' => '#f44336', 'red' => '#f44336',
@ -29,24 +42,21 @@
'customized' => $layout_info->customized_primary_color, 'customized' => $layout_info->customized_primary_color,
); );
} }
<block cond="$layout_info->extra_var->primary_color->type === 'select' || $layout_info->extra_var->customized_primary_color->type === 'colorpicker'">
{@
if(!$layout_info->primary_color && $layout_info->customized_primary_color)
$layout_info->primary_color = 'customized';
if(!$layout_info->primary_color)
$layout_info->primary_color = 'red';
if(!$layout_info->customized_primary_color)
$layout_info->customized_primary_color = '#f44336';
}
</block>
<block cond="$layout_info->extra_var->primary_color->type !== 'select' && $layout_info->extra_var->customized_primary_color->type !== 'colorpicker'">
{@$layout_info->primary_color = 'blue';}
</block>
<!--// Load styles --> <!--// Load styles -->
{@$colorset = $material_colors[$colorset];} {@$colorset = $material_colors[$member_config->colorset];}
{@$skin_color = $material_colors[$layout_info->primary_color];} {@$skin_color = $material_colors[$layout_info->primary_color];}
<block cond="$colorset">
<!--@if(preg_match("/#([a-f0-9]{3}){1,2}/i", trim($colorset)) && in_array(strlen(trim($colorset)), array(4, 7)))-->
{@$skin_color = trim($colorset)}
<!--@if(strlen(trim($colorset)) === 4)-->
{@$skin_color = trim($colorset)[1].trim($colorset)[1].trim($colorset)[2].trim($colorset)[2].trim($colorset)[3].trim($colorset)[3]}
<!--@endif-->
<!--@else-->
{@$skin_color = '#f44336'}
<!--@endif-->
</block>
<block cond="!$skin_color"> <block cond="!$skin_color">
<!--@if(preg_match("/#([a-f0-9]{3}){1,2}/i", $layout_info->primary_color))--> <!--@if(preg_match("/#([a-f0-9]{3}){1,2}/i", $layout_info->primary_color) && in_array(strlen(trim($colorset)), array(4, 7)))-->
{@$skin_color = $layout_info->primary_color} {@$skin_color = $layout_info->primary_color}
<!--@if(strlen($layout_info->primary_color) === 4)--> <!--@if(strlen($layout_info->primary_color) === 4)-->
{@$skin_color = $layout_info->primary_color[1].$layout_info->primary_color[1].$layout_info->primary_color[2].$layout_info->primary_color[2].$layout_info->primary_color[3].$layout_info->primary_color[3]} {@$skin_color = $layout_info->primary_color[1].$layout_info->primary_color[1].$layout_info->primary_color[2].$layout_info->primary_color[2].$layout_info->primary_color[3].$layout_info->primary_color[3]}
@ -55,9 +65,6 @@
{@$skin_color = '#f44336'} {@$skin_color = '#f44336'}
<!--@endif--> <!--@endif-->
</block> </block>
<block cond="$colorset">
{@$skin_color = $colorset}
</block>
{@Context::set('less_color', array('red' => hexdec(substr($skin_color, 1, 2)), 'green' => hexdec(substr($skin_color, 3, 2)), 'blue' => hexdec(substr($skin_color, 5, 2)), 'thumbnail_height' => intval($widget_info->thumbnail_height), 'thumbnail_width' => intval($widget_info->thumbnail_width)))} {@Context::set('less_color', array('red' => hexdec(substr($skin_color, 1, 2)), 'green' => hexdec(substr($skin_color, 3, 2)), 'blue' => hexdec(substr($skin_color, 5, 2)), 'thumbnail_height' => intval($widget_info->thumbnail_height), 'thumbnail_width' => intval($widget_info->thumbnail_width)))}
<load target="css/css.less" vars="$less_color" /> <load target="css/css.less" vars="$less_color" />