Refine member skin - simple world

This commit is contained in:
MinSoo Kim 2017-02-05 21:26:09 +09:00
parent 3abf529f8c
commit 57d6bbf880
13 changed files with 89 additions and 58 deletions

View file

@ -12,7 +12,7 @@
</block>
</dl>
<p style="border: 0 none;margin: 0;padding: 20px;">
{$lang->msg_confirm_account_comment}<br />
{lang('member.msg_confirm_account_comment')}<br />
<a href="{$auth_url}" target="_blank" style="color: #2196f3;text-decoration: none;">{$auth_url}</a>
</p>
</section>

View file

@ -1,4 +1,9 @@
@charset "UTF-8";
/*
@method .text-contrast()
@author misol <misol.kr@gmail.com>
@brief Select a text color according to WCAG 2.0 contrast guideline. The calcualtion of contrast follows the formula on the guideline.
*/
.text-contrast(@bg_color; @bright_color:#fff; @dark_color:#000; @i:0) when (@i >= 10) and ( ( (luma(@bg_color) + 0.05) / (luma(@dark_color) + 0.05) ) =< ( ( luma(@bright_color) + 0.05) / ( luma(@bg_color) + 0.05) )) {
color: @bright_color;
}
@ -18,6 +23,12 @@
.text-contrast(@bg_color; @bright_color; darken(@dark_color, 5%); @i + 1);
}
/*
@method .bg-contrast()
@author misol <misol.kr@gmail.com>
@brief Select a background color, which has less contrast background color than WCAG 2.0 contrast guideline. On the WCAG 2.0 guideline, bigger string can have less contrast as 3.0.
*/
.bg-contrast(@text_color; @bright_color:#fff; @dark_color:#000; @i:0) when (@i >= 10) and ( ( (luma(@bg_color) + 0.05) / (luma(@dark_color) + 0.05) ) =< ( ( luma(@bright_color) + 0.05) / ( luma(@bg_color) + 0.05) )) {
background: @bright_color;
}
@ -38,18 +49,22 @@
.bg-contrast(@text_color; @bright_color; darken(@dark_color, 5%); @i + 1);
}
/* As LESS library in Rhymix substitude variables as an strings, convert colors as the color objects of LESS. */
@color: rgb(@red, @green, @blue);
/* As this file handle some wild-selectors to control display settings, hide inline script and style codes. */
script, style
{
display:none!important;
}
/* Member skin container, default settings */
.rx_simple_member
{
font-family: "맑은 고딕", "Apple SD Gothic Neo","나눔고딕",NanumGothic,'Nanum Gothic',Arial,Helvetica,sans-serif;
font-size: 14px;
margin: 8px 0px;
padding: 0 15px;
padding: 0 5px;
}
.rx_simple_member a
@ -57,13 +72,13 @@ script, style
color: @color;
text-decoration: none;
}
/* Horizontal Align */
/* Horizontal align */
.rx_simple_member .pos-right
{
position:absolute;
right:0
}
/* message */
/* message; error, info, update */
.rx_member-notice, .rx_member-notice.info
{
@ -101,7 +116,7 @@ script, style
box-sizing:border-box;
background:#ffffff;
margin: 0 0 20px;
border: 1px solid #e0e0e0;
box-shadow: 0 1px 2px rgba(0,0,0,0.16), 0 1px 2px rgba(0,0,0,0.23);
}
.rx_simple_member .sw-body>*
{
@ -143,7 +158,7 @@ script, style
list-style:none;
border-bottom: 1px solid #e0e0e0;
}
.rx_simple_member .sw-body dl dt, .rx_simple_member form>div.control-group>label
.rx_simple_member .sw-body dl dt, .rx_simple_member form>div.control-group>label, .rx_simple_member form>div.control-group>div.control-label
{
font-weight: bold;
border:0;
@ -155,29 +170,29 @@ script, style
white-space: normal;
box-sizing: border-box;
}
.rx_simple_member form div.control-group>input[type="submit"], .rx_simple_member .sw-footer>a, .rx_simple_member .sw-anchor-buttons a
.rx_simple_member form div.control-group>input[type="submit"], .rx_simple_member form div.control-group>input.btn.dateRemover, .rx_simple_member .sw-footer>a, .rx_simple_member .sw-anchor-buttons a
{
display:block;
.bg-contrast(#fff, lighten(@color,10%),darken(@color,10%));
font-weight: bold;
border: medium none;
color: #fff;
padding: 10px;
vertical-align: bottom;
.bg-contrast(darken(@color,45%), lighten(@color,10%),darken(@color,10%));
font-weight: bold;
border:0;
box-shadow: 0 1px 2px rgba(0,0,0,0.16), 0 1px 2px rgba(0,0,0,0.23);
color: darken(@color,45%);
}
.rx_simple_member form div.control-group>input[type="submit"], .rx_simple_member .sw-footer{
margin: 20px 0;
margin: 20px 0 0;
}
/* 상단 탭 스타일 */
/* Tab over the main content. */
.rx_simple_member div.rx_simple_tab{
overflow: hidden;
background: #ffffff;
width:100%;
margin: 5px 0;
height: 52px;
overflow: hidden;
white-space: nowrap;
border: 1px solid #e0e0e0;
margin-bottom:5px;
box-shadow: 0 1px 2px rgba(0,0,0,0.16), 0 1px 2px rgba(0,0,0,0.23);
box-sizing: border-box;
}
.rx_simple_member ul.rx_simple_tab{
@ -223,7 +238,7 @@ script, style
}
/* 글 목록 스타일 */
/* The list of document style */
.rx_simple_member .rx_sw_list .cont_a {
color: #222;
display: block;
@ -302,8 +317,9 @@ script, style
display: inline-block;
background: #fff;
font-size: 14px;
border: 1px solid #e0e0e0;
box-shadow: 0 1px 2px rgba(0,0,0,0.16), 0 1px 2px rgba(0,0,0,0.23);
color: #000;
font-weight: bold;
padding: 10px;
min-width:25px;
text-decoration: none;
@ -321,11 +337,12 @@ script, style
}
/* button hover */
.rx_simple_member form div.control-group>input[type="submit"]:hover, .rx_simple_member .sw-footer>a:hover, .rx_simple_member .sw-anchor-buttons a:hover, .rx_simple_member .pagination ul li>a:hover, .rx_simple_member .rx_sw_list .content_delete button:hover,
.rx_simple_member form div.control-group>input[type="submit"]:focus, .rx_simple_member .sw-footer>a:focus, .rx_simple_member .sw-anchor-buttons a:focus, .rx_simple_member .pagination ul li>a:focus, .rx_simple_member .rx_sw_list .content_delete button:focus
.rx_simple_member form div.control-group>input[type="submit"]:hover, .rx_simple_member form div.control-group>input.btn.dateRemover:hover, .rx_simple_member .sw-footer>a:hover, .rx_simple_member .sw-anchor-buttons a:hover, .rx_simple_member .pagination ul li>a:hover, .rx_simple_member .rx_sw_list .content_delete button:hover,
.rx_simple_member form div.control-group>input[type="submit"]:focus, .rx_simple_member form div.control-group>input.btn.dateRemover:focus, .rx_simple_member .sw-footer>a:focus, .rx_simple_member .sw-anchor-buttons a:focus, .rx_simple_member .pagination ul li>a:focus, .rx_simple_member .rx_sw_list .content_delete button:focus
{
.bg-contrast(#fff, lighten(@color, 13%), darken(@color, 13%));
font-weight:bold;
color:#fff;
box-shadow: 0 2px 4px rgba(0,0,0,0.16), 0 2px 4px rgba(0,0,0,0.23);
}

View file

@ -29,15 +29,15 @@
</section>
<div class="pagination pagination-centered">
<ul>
<li><a href="{getUrl('page','','module_srl','')}" class="direction">&laquo; {$lang->first_page}</a></li>
<li><a href="{getUrl('page','','module_srl','')}" class="direction">&lsaquo; {lang('common.first_page')}</a></li>
<!--@while($page_no = $page_navigation->getNextPage())-->
<li class="active"|cond="$page == $page_no"><a href="{getUrl('page',$page_no,'module_srl','')}">{$page_no}</a></li>
<!--@end-->
<li><a href="{getUrl('page',$page_navigation->last_page,'module_srl','')}" class="direction">{$lang->last_page} &raquo;</a></li>
<li><a href="{getUrl('page',$page_navigation->last_page,'module_srl','')}" class="direction">{lang('common.last_page')} &rsaquo;</a></li>
</ul>
</div>
<div class="sw-footer sw-anchor-buttons">
<a href="{getUrl('','module','module','act','dispModuleSelectList','id','target_module','type','single')}" onclick="popopen(this.href,'ModuleSelect');return false;">{$lang->cmd_find_module}</a>
<a href="{getUrl('selected_module_srl','')}" cond="$selected_module_srl">{$lang->cmd_cancel}</a>
<a href="{getUrl('','module','module','act','dispModuleSelectList','id','target_module','type','single')}" onclick="popopen(this.href,'ModuleSelect');return false;">{lang('module.cmd_find_module')}</a>
<a href="{getUrl('selected_module_srl','')}" cond="$selected_module_srl">{lang('common.cmd_cancel')}</a>
</div>
<include target="./common_footer.html" />

View file

@ -1,10 +1,10 @@
<include target="./common_header.html" />
<section class="sw-body">
<h1>{$lang->cmd_find_member_account_with_email}</h1>
<h1>{lang('member.cmd_find_member_account_with_email')}</h1>
<div cond="$XE_VALIDATOR_MESSAGE && $XE_VALIDATOR_ID == 'modules/member/skin/simple_world/find_member_account/1'" class="rx_member-notice {$XE_VALIDATOR_MESSAGE_TYPE}">
<p>{$XE_VALIDATOR_MESSAGE}</p>
</div>
<p class="rx_member-notice">{$lang->about_find_member_account}</p>
<p class="rx_member-notice">{lang('member.about_find_member_account')}</p>
<form action="{getUrl('', 'act', 'procMemberFindAccount')}" method="get" ruleset="findAccount">
<input type="hidden" name="mid" value="{$mid}" />
<input type="hidden" name="act" value="procMemberFindAccount" />
@ -15,18 +15,18 @@
<label for="uid">
{lang('common.email_address')}
</label>
<input type="email" name="email_address" id="uid" required title="{$lang->email_address}" />
<input type="email" name="email_address" id="uid" required title="{lang('common.email_address')}" />
<block cond="$captcha">{$captcha}<br /></block>
<input type="submit" value="{$lang->cmd_find_member_account}" />
<input type="submit" value="{lang('member.cmd_find_member_account')}" />
</div>
</form>
</section>
<section class="sw-body" cond="count($lang->find_account_question_items)>1 && $enable_find_account_question == 'Y'">
<section class="sw-body" cond="count(lang('member.find_account_question_items'))>1 && $enable_find_account_question == 'Y'">
<h1>{$lang->cmd_find_member_account_with_email_question}</h1>
<div cond="$XE_VALIDATOR_MESSAGE && $XE_VALIDATOR_ID == 'modules/member/skin/simple_world/find_member_account/2'" class="rx_member-notice {$XE_VALIDATOR_MESSAGE_TYPE}">
<p>{$XE_VALIDATOR_MESSAGE}</p>
</div>
<p class="rx_member-notice">{$lang->about_find_account_question}</p>
<p class="rx_member-notice">{lang('member.about_find_account_question')}</p>
<form action="{getUrl('', 'act', 'procMemberFindAccountByQuestion')}" method="get" ruleset="@find_member_account_by_question">
<input type="hidden" name="module" value="member" />
<input type="hidden" name="mid" value="{$mid}" />
@ -39,35 +39,35 @@
<label for="user_id" cond="$identifier == 'user_id'">
{lang('common.user_id')}
</label>
<input type="text" name="user_id" id="user_id" required title="{$lang->user_id}" cond="$identifier == 'user_id'" />
<input type="text" name="user_id" id="user_id" required title="{lang('common.user_id')}" cond="$identifier == 'user_id'" />
<label for="email_address2">
{lang('common.email_address')}
</label>
<input type="email" name="email_address" id="email_address2" required title="{$lang->email_address}" />
<input type="email" name="email_address" id="email_address2" required title="{lang('common.email_address')}" />
<label for="find_account_question">
{lang('member.find_account_question')}
</label>
<select name="find_account_question" id="find_account_question">
<!--@for($i=1,$c=count($lang->find_account_question_items);$i<=$c;$i++)-->
<option value="{$i}">{$lang->find_account_question_items[$i]}</option>
<!--@for($i=1,$c=count(lang('member.find_account_question_items'));$i<=$c;$i++)-->
<option value="{$i}">{lang('member.find_account_question_items')[$i]}</option>
<!--@end-->
</select>
</div>
<div class="control-group">
<input type="text" name="find_account_answer" value="" required title="{$lang->find_account_question}" />
<input type="text" name="find_account_answer" value="" required title="{lang('member.find_account_question')}" />
</div>
<div class="control-group">
<block cond="$captcha">{$captcha}<br /></block>
<input type="submit" value="{$lang->cmd_get_temp_password}" />
<input type="submit" value="{lang('member.cmd_get_temp_password')}" />
</div>
</form>
</section>
<section class="sw-body">
<h1>{$lang->cmd_resend_auth_mail}</h1>
<h1>{lang('member.cmd_resend_auth_mail')}</h1>
<div cond="$XE_VALIDATOR_MESSAGE && $XE_VALIDATOR_ID == 'modules/member/skin/simple_world/find_member_account/3'" class="rx_member-notice {$XE_VALIDATOR_MESSAGE_TYPE}">
<p>{$XE_VALIDATOR_MESSAGE}</p>
</div>
<p class="rx_member-notice">{$lang->about_resend_auth_mail}</p>
<p class="rx_member-notice">{lang('member.about_resend_auth_mail')}</p>
<form ruleset="resendAuthMail" action="{getUrl('', 'act', 'procMemberResendAuthMail')}" method="post">
<input type="hidden" name="module" value="member" />
<input type="hidden" name="act" value="procMemberResendAuthMail" />
@ -77,9 +77,9 @@
<label for="email_address3">
{lang('common.email_address')}
</label>
<input type="email" id="email_address3" name="email_address" value="" required title="{$lang->email_address}" /><br />
<input type="email" id="email_address3" name="email_address" value="" required title="{lang('common.email_address')}" /><br />
<block cond="$captcha">{$captcha}<br /></block>
<input type="submit" value="{$lang->cmd_resend_auth_mail}" />
<input type="submit" value="{lang('member.cmd_resend_auth_mail')}" />
</div>
</form>
</section>

View file

@ -10,7 +10,7 @@
<dt style="border: 0 none;font-weight: bold;box-sizing: border-box;display: block;margin: 10px 0 0;min-height: 25px;position: relative;width: 100%;">{lang($name)}</dt>
<dl style="border-bottom: 1px solid #e0e0e0;list-style: outside none none;box-sizing: border-box;display: block;margin: 10px 0 0;min-height: 25px;position: relative;width: 100%;">{$value}</dl>
</block>
<dt style="border: 0 none;font-weight: bold;box-sizing: border-box;display: block;margin: 10px 0 0;min-height: 25px;position: relative;width: 100%;">{$lang->password}</dt>
<dt style="border: 0 none;font-weight: bold;box-sizing: border-box;display: block;margin: 10px 0 0;min-height: 25px;position: relative;width: 100%;">{lang('common.password')}</dt>
<dl style="border-bottom: 1px solid #e0e0e0;list-style: outside none none;box-sizing: border-box;display: block;margin: 10px 0 0;min-height: 25px;position: relative;width: 100%;color:red">{$auth_args->new_password}</dl>
</dl>
<p style="border: 0 none;margin: 0;padding: 20px;">

View file

@ -1,7 +1,7 @@
<include target="./common_header.html" />
<section class="sw-body">
<h1>{lang('member.cmd_find_member_account')}</h1>
<div class="rx_member-notice">{lang('$lang->about_temp_password')}</div>
<div class="rx_member-notice">{lang('member.about_temp_password')}</div>
<dl>
<dt>{lang('common.user_id')}</dt>
<dd>{$user_id}</dd>

View file

@ -0,0 +1,2 @@
<?php
$lang->member_simple_world_about_star = 'Items with an asterisk <sup>*</sup> are required.';

View file

@ -0,0 +1,2 @@
<?php
$lang->member_simple_world_about_star = 'アスタリスク<sup>*</sup>のある項目は必須項目です。';

View file

@ -0,0 +1,2 @@
<?php
$lang->member_simple_world_about_star = '별표<sup>*</sup>가 있는 항목은 필수 항목입니다.';

View file

@ -18,16 +18,16 @@
{lang('common.email_address')}
</block>
</label>
<input type="text" cond="$identifier == 'user_id'" name="user_id" id="uid" required title="{$lang->user_id}" />
<input type="email" cond="$identifier != 'user_id'" name="user_id" id="uid" required title="{$lang->email_address}" />
<input type="text" cond="$identifier == 'user_id'" name="user_id" id="uid" required title="{lang('common.user_id')}" />
<input type="email" cond="$identifier != 'user_id'" name="user_id" id="uid" required title="{lang('common.email_address')}" />
<label for="upw">{lang('common.password')}<a class="pos-right" href="{getUrl('act','dispMemberFindAccount')}">{lang('member.cmd_find_member_account')}</a></label>
<input type="password" name="password" id="upw" required title="{$lang->password}" />
<input type="password" name="password" id="upw" required title="{lang('common.password')}" />
<label for="keepid_opt">
<input type="checkbox" name="keep_signed" id="keepid_opt" value="Y" />
{$lang->keep_signed}
{lang('member.keep_signed')}
</label>
<div id="rx_member-warning" class="rx_member-notice">
{$lang->about_keep_warning}
{lang('member.about_keep_warning')}
</div>
<input type="submit" value="{$lang->cmd_login}" />
</div>

View file

@ -27,11 +27,11 @@
</section>
<div class="pagination pagination-centered">
<ul>
<li><a href="{getUrl('page','','module_srl','')}" class="direction">&laquo; {$lang->first_page}</a></li>
<li><a href="{getUrl('page','','module_srl','')}" class="direction">&lsaquo; {$lang->first_page}</a></li>
<!--@while($page_no = $page_navigation->getNextPage())-->
<li class="active"|cond="$page == $page_no"><a href="{getUrl('page',$page_no,'module_srl','')}">{$page_no}</a></li>
<!--@end-->
<li><a href="{getUrl('page',$page_navigation->last_page,'module_srl','')}" class="direction">{$lang->last_page} &raquo;</a></li>
<li><a href="{getUrl('page',$page_navigation->last_page,'module_srl','')}" class="direction">{$lang->last_page} &rsaquo;</a></li>
</ul>
</div>
<include target="./common_footer.html" />

View file

@ -1,5 +1,6 @@
<include target="./common_header.html" />
<load target="../../tpl/js/signup_check.js" />
<load target="./lang" />
<!--// datepicker javascript plugin load -->
<!--%load_js_plugin("ui")-->
<!--%load_js_plugin("ui.datepicker")-->
@ -8,6 +9,9 @@
<div cond="$XE_VALIDATOR_MESSAGE && $XE_VALIDATOR_ID == 'modules/member/skins/simple_world/1'" class="rx_member-notice {$XE_VALIDATOR_MESSAGE_TYPE}">
<p>{$XE_VALIDATOR_MESSAGE}</p>
</div>
<div class="rx_member-notice info">
<p>{lang('member_simple_world_about_star')}</p>
</div>
<form ruleset="@insertMember" id="fo_insert_member" action="./" method="post" enctype="multipart/form-data" class="form-horizontal">
<input type="hidden" name="act" value="procMemberModifyInfo" />
<input type="hidden" name="module" value="member" />
@ -16,10 +20,10 @@
<input type="hidden" name="page" value="{$page}" />
<input type="hidden" name="xe_validator_id" value="modules/member/skins/simple_world/1" />
<div class="control-group">
<label for="{$identifierForm->name}">{$identifierForm->title}<sup>*</sup></label>
<label for="{$identifierForm->name}">{$identifierForm->title}<sup style="color:red">*</sup></label>
<input type="text" name="{$identifierForm->name}" id="{$identifierForm->name}" value="{$identifierForm->value}" readonly />
<block loop="$formTags=>$formTag">
<label for="{$formTag->name}">{$formTag->title}</label>
<label for="{$formTag->name}" class="control-label">{trim(str_replace('*','',strip_tags($formTag->title)))}<!--@if(strpos($formTag->title,'<em style="color:red">*</em>') !== false)--><sup style="color:red">*</sup><!--@endif--></label>
<block cond="$formTag->name != 'signature'">{$formTag->inputTag}</block>
<block cond="$formTag->name =='signature'">{$editor}</block>
</block>
@ -75,7 +79,7 @@ jQuery(function($){
$(".inputDate").prop('readonly', false);
}
$(".dateRemover").click(function() {
$(this).prevAll('input').val('');
$('#date_birthday,#birthday').val('');
return false;});
});
})(jQuery);

View file

@ -1,13 +1,17 @@
<load target="./js/signup_check.js" type="body" />
<load target="./lang" />
<!--// datepicker javascript plugin load -->
<!--%load_js_plugin("ui")-->
<!--%load_js_plugin("ui.datepicker")-->
<include target="./common_header.html" />
<section class="sw-body">
<h1>{$lang->cmd_signup}</h1>
<h1>{lang('member.cmd_signup')}</h1>
<div cond="$XE_VALIDATOR_MESSAGE && $XE_VALIDATOR_ID == 'modules/member/skins'" class="rx_member-notice {$XE_VALIDATOR_MESSAGE_TYPE}">
<p>{$XE_VALIDATOR_MESSAGE}</p>
</div>
<div class="rx_member-notice info">
<p>{lang('member_simple_world_about_star')}</p>
</div>
<form ruleset="@insertMember" id="rx_insert_member" action="./" method="post" enctype="multipart/form-data" class="form-horizontal">
<input type="hidden" name="act" value="procMemberInsert" />
<input type="hidden" name="xe_validator_id" value="modules/member/skins" />
@ -29,13 +33,13 @@
<p class="rx_member-notice" cond="$identifierForm->name == 'email_address' && $email_confirmation_required == 'Y'">
{$lang->msg_email_confirmation_required}
</p>
<label for="password" class="control-label"><em style="color:red">*</em> {$lang->password}</label>
<label for="password" class="control-label">{lang('common.password')}<sup style="color:red">*</sup></label>
<input type="password" name="password" id="password" value="" required />
<p class="rx_member-notice">{$lang->about_password_strength[$member_config->password_strength]}</p>
<label for="password2" class="control-label"><em style="color:red">*</em> {$lang->password3}</label>
<p class="rx_member-notice">{lang('member.about_password_strength')[$member_config->password_strength]}</p>
<label for="password2" class="control-label">{lang('common.password3')}<sup style="color:red">*</sup></label>
<input type="password" name="password2" id="password2" value="" required />
<block loop="$formTags=>$formTag">
<label for="{$formTag->name}" class="control-label">{$formTag->title}</label>
<label for="{$formTag->name}" class="control-label">{trim(str_replace('*','',strip_tags($formTag->title)))}<!--@if(strpos($formTag->title,'<em style="color:red">*</em>') !== false)--><sup style="color:red">*</sup><!--@endif--></label>
<block cond="$formTag->name != 'signature'">
{$formTag->inputTag}
<p class="rx_member-notice" cond="$formTag->name == 'email_address' && $email_confirmation_required == 'Y'">