5.3 버전 내용 적용

mobile/skin/outlogin/basic/outlogin.skin.1.php

@@ -11,16 +11,25 @@ add_stylesheet('<link rel="stylesheet" href="'.$outlogin_skin_url.'/style.css">'
     <form name="foutlogin" action="<?php echo $outlogin_action_url ?>" onsubmit="return fhead_submit(this);" method="post" autocomplete="off">
     <fieldset>
         <input type="hidden" name="url" value="<?php echo $outlogin_url ?>">
-        <input type="text" name="mb_id" id="ol_id" placeholder="회원아이디(필수)" required class="required" maxlength="20">
-        <input type="password" id="ol_pw" name="mb_password" placeholder="비밀번호(필수)" required class="required" maxlength="20">
-        <input type="submit" id="ol_submit" value="로그인">
+        <input type="text" name="mb_id" id="ol_id" placeholder="아이디" required maxlength="20">
+        <input type="password" id="ol_pw" name="mb_password" placeholder="비밀번호" required  maxlength="20">
         <div id="ol_svc">
             <input type="checkbox" id="auto_login" name="auto_login" value="1">
             <label for="auto_login" id="auto_login_label">자동로그인</label>
+
+        </div>
+        <input type="submit" id="ol_submit" value="로그인" class="btn_submit">
+        <div class="ol_before_btn">
             <a href="<?php echo G5_BBS_URL ?>/register.php"><b>회원가입</b></a>
             <a href="<?php echo G5_BBS_URL ?>/password_lost.php" id="ol_password_lost">정보찾기</a>
         </div>
     </fieldset>
+
+    <?php
+    // 소셜로그인 사용시 소셜로그인 버튼
+    @include_once(get_social_skin_path().'/social_outlogin.skin.1.php');
+    ?>
+
     </form>
 </aside>
 

mobile/skin/outlogin/basic/outlogin.skin.2.php

@@ -7,21 +7,31 @@ add_stylesheet('<link rel="stylesheet" href="'.$outlogin_skin_url.'/style.css">'
 
 <!-- 로그인 후 외부로그인 시작 -->
 <aside id="ol_after" class="ol">
-    <header id="ol_after_hd">
-        <h2>나의 회원정보</h2>
+   
+    <h2>나의 회원정보</h2>
+    <div id="ol_after_hd">
+        <span class="profile_img">
+            <?php echo get_member_profile_img($member['mb_id']); ?>
+            <a href="<?php echo G5_BBS_URL ?>/member_confirm.php?url=register_form.php" id="ol_after_info" title="정보수정">정보수정</a>
+        </span>
         <strong><?php echo $nick ?>님</strong>
-        <?php if ($is_admin == 'super' || $is_auth) { ?><a href="<?php echo G5_ADMIN_URL ?>" class="btn_admin">관리자 모드</a><?php } ?>
-    </header>
+    </div>
+
+    <div id="ol_after_btn">
+        <?php if ($is_admin == 'super' || $is_auth) { ?><a href="<?php echo G5_ADMIN_URL ?>" class="btn_admin">관리자</a><?php } ?>
+        <a href="<?php echo G5_BBS_URL ?>/logout.php" id="ol_after_logout">로그아웃</a>
+    </div>
+
     <ul id="ol_after_private">
         <li id="ol_after_memo">
             <a href="<?php echo G5_BBS_URL ?>/memo.php" target="_blank">
-                <span class="sound_only">안 읽은 </span>쪽지
+                <span class="sound_only">안 읽은 쪽지</span>
                 <strong><?php echo $memo_not_read ?></strong>
             </a>
         </li>
         <li id="ol_after_pt">
             <a href="<?php echo G5_BBS_URL ?>/point.php" target="_blank">
-                포인트
+                <span class="sound_only"> 포인트</span>
                 <strong><?php echo $point ?></strong>
             </a>
         </li>
@@ -29,10 +39,7 @@ add_stylesheet('<link rel="stylesheet" href="'.$outlogin_skin_url.'/style.css">'
             <a href="<?php echo G5_BBS_URL ?>/scrap.php" target="_blank">스크랩</a>
         </li>
     </ul>
-    <footer id="ol_after_ft">
-        <a href="<?php echo G5_BBS_URL ?>/member_confirm.php?url=register_form.php" id="ol_after_info">정보수정</a>
-        <a href="<?php echo G5_BBS_URL ?>/logout.php" id="ol_after_logout">로그아웃</a>
-    </footer>
+
 </aside>
 
 <script>

mobile/skin/outlogin/basic/style.css

@@ -1,29 +1,29 @@
 @charset "utf-8";
-/* SIR 지운아빠 */
-
-/* 아웃로그인 */
-.ol {position:relative;margin:0 0 10px;padding:0 5px 5px;border-bottom:1px solid #e7f1ed}
+.ol {position:relative;margin:0 0 10px;padding:20px;background:#292929;text-align:center;}
 .ol h2 {width:0;height:0;overflow:hidden}
 
-.ol a.btn_admin {display:inline-block;margin:0 0 5px;padding:0 10px;border:1px solid #e8180c;background:#e8180c;color:#fff;text-decoration:none;line-height:2em;vertical-align:middle} /* 관리자 전용 버튼 */
-.ol a.btn_admin:focus, .ol a.btn_admin:hover {text-decoration:none}
+#ol_before{padding:20px 30px 30px}
+#ol_before input[type=text], #ol_before input[type=password] {width:100%;border:0;border-bottom:1px solid #434242;background:none;height:40px;;margin:0 0 10px;color:#fff}
+#ol_submit {width:100%;height:40px;border-radius:23px;font-weight:bold;font-size:1.083em; }
+#ol_svc {text-align:left;color:#dadada;font-size:0.92em;margin:5px 0 20px}
+.ol_before_btn{margin:15px 0 0;color:#aaa;line-height:1em}
+.ol_before_btn a{color:#fff;display:inline-block;width:50%;float:left}
+#ol_password_lost{border-left:1px solid #777}
 
-#ol_before input[type=text], #ol_before input[type=password] {display:block;margin-bottom:5px;padding:0;width:80%;height:1.8em;border:1px solid #e4eaec;background:#f7f7f7;vertical-align:middle;line-height:1.8em}
-#ol_before input[type=submit] {position:absolute;top:0;right:5px;padding:0 !important;width:18%;height:4.3em;border:0;background:#333;color:#fff;letter-spacing:-0.1em;vertical-align:top;cursor:pointer}
-#ol_svc {margin:15px 0 5px;text-align:right}
-#ol_svc a {display:inline-block;margin:0 0 0 5px;color:#000;text-decoration:none;vertical-align:middle}
-
-#ol_after_hd strong {display:inline-block;padding:0 0 5px}
+#ol_after_hd strong {display:block;color:#fff;}
 #ol_after_hd .btn_admin {display:block;padding:0 !important;text-align:center}
+#ol_after_hd .profile_img{display:inline-block;position:relative;margin:0 0 10px}
+#ol_after_hd  .profile_img img{border-radius:50%;width:60px;height:60px}
+#ol_after_info{position:absolute;bottom:-5px;right:-5px;background:url(./img/icon_edit.png) no-repeat 50% 50% #292929;background-size:15px;width:30px;height:30px;text-indent:-9999px;overflow:hidden;border-radius:50%}
+
 #ol_after_private {margin:0;padding:0;list-style:none}
 #ol_after_private:after {display:block;visibility:hidden;clear:both;content:""}
-#ol_after_private li {float:left}
-#ol_after_memo {width:30%}
-#ol_after_pt {width:40%}
-#ol_after_scrap {width:30%}
-#ol_after_private a {display:block;height:3em;background:#f7f7f7;color:#000;text-decoration:none;text-align:center;line-height:3em}
-#ol_after_private a strong {color:#000;font-weight:normal}
-#ol_after_private a:nth-of-type(1) {border-right:1px solid #fff}
-#ol_after_private a:nth-of-type(2) {border-right:1px solid #fff}
-#ol_after_ft {margin-top:5px;text-align:right}
-#ol_after_ft a {display:inline-block;padding:0 20px;height:2em;background:#333;color:#fff;text-decoration:none;text-align:center;line-height:2em}
+#ol_after_private li {float:left;width:33.333%}
+#ol_after_memo {background:url(./img/icon_memo.png) no-repeat 36px 22px #2c2d2e;background-size:19px}
+#ol_after_pt {background:url(./img/icon_point.png) no-repeat 38px 24px #313334;background-size:16px}
+#ol_after_scrap {background:url(./img/icon_scrap.png) no-repeat 38px 22px #2c2d2e;background-size:18px}
+#ol_after_private a {color:#fff;height:90px;display:block;padding-top:60px}
+
+#ol_after_btn {margin:15px 0}
+#ol_after_btn a{display:inline-block;padding:0 10px;line-height:25px;border-radius:15px;font-weight:bold}
+#ol_after_logout{background:#fff;color:#555}