작업실

로그인 영역 CSS 수정사항

컨텐츠 정보

  • 11,074 조회
  • 17 댓글
  • 0 추천
  • 목록

본문

Before







After





별 차이가 없죠? ㅠㅠㅠㅠ


로그인 칸과 밑에 여백 좀 줬습니다 .ㅎㅎ


/amina/misc/outlogin/basic/outlogin.css를


이것저것 바꿔서 다 올려봅니다.



@charset "utf-8";


/* Logout */
#ol_logout { border:1px solid #ddd; padding:7px 10px 9px; background:#fafafa; zoom:1; }
#ol_logout form { padding:0px; margin:0px; }
#ol_logout a { color:#fff; text-decoration:none; letter-spacing:-1px; }
#ol_logout a:hover { color:orangered; text-decoration:none; letter-spacing:-1px; }
#ol_logout ul { padding:0px; margin:0px; list-style:none; color:#888; font:normal 11px dotum; letter-spacing:-1px; }
#ol_logout ul li { padding:0px; margin:0px; line-height:32px; }
#ol_logout .id_none, #ol_logout .id_focus, #ol_logout .pw_none, #ol_logout .pw_focus, #ol_logout input[type=text], #ol_logout input[type=password] { width:94%; height:24px; font:normal 12px dotum; color:#333;padding:0px 5px; line-height:24px; }
#ol_logout .login_submit, #ol_logout input[type=submit] { width:60px; text-align:center; border:0px; background:#333; color:#fff; font:bold 11px dotum; letter-spacing:-1px; padding:4px 0px 3px; margin:0px; line-height:16px; cursor:pointer; }
#ol_logout .id_none { border:1px solid #ddd; background:#fff url('./img/id.gif') no-repeat center left; }
#ol_logout .pw_none { border:1px solid #ddd; background:#fff url('./img/pw.gif') no-repeat center left; }
#ol_logout .id_focus, #ol_logout .pw_focus { border:1px solid #000; background:#fff; }
#ol_logout .join { clear:both; }
#ol_logout .join b { color:#000; }


/* Login */
#ol_login {	border:1px solid #ddd; padding:10px; background:#fafafa; zoom:1; }
#ol_login a:link, #ol_login a:visited{ color:#888; text-decoration:none; }
#ol_login a:hover, #ol_login a:active{ color:orangered; text-decoration:none; }
#ol_login .mb-photo { display:inline; float:left; border:1px solid #ddd; margin-right:12px; }
#ol_login .mb-photo img { display:block; border:0; }
#ol_login p { padding:4px 0px 0px; margin:0px; line-height:1.6; font:normal 11px dotum; letter-spacing:-1px; color:#787878; }
#ol_login p strong { display:block; color:#000; font:bold 12px dotum; letter-spacing:0px; margin:6px 12px !important; }
#ol_login ul { clear:both; margin:0px; padding:0px; list-style:none; }
#ol_login ul:after, #ol_login p:after { display:block;visibility:hidden;clear:both;content:""; }
#ol_login li { margin:0px; padding:0px; letter-spacing:-1px; }
#ol_login li.ol_xp_level { padding:5px; font:bold 10px verdana; }
#ol_login .ol_xp_bar { clear:both; height:12px; line-height:12px; border:1px solid #eee; background-color:#fff; cursor:pointer; }
#ol_login .ol_xp_bar #ol_xp_per { width:0px; height:12px; background-color:#2167d1; }
#ol_login li.ol_btn_l { width:48%; text-align:center; background:#fff; border:1px solid #ddd; padding:10px 0px; margin:5px 0px 0px; font:normal 11px dotum; }
#ol_login li.ol_btn_l strong { display:block;padding-top:3px;color:#000;font:bold 10px tahoma; letter-spacing:0px; }
#ol_login li.ol_btn_l b { font-weight:normal; color:#000; }
#ol_login li.ol_btn_s {	width:48%; text-align:center; background:#fff; border:1px solid #ddd; padding:6px 0px; margin:4px 0px 0px; font:normal 11px dotum; }
#ol_login li.ol_btn_s b { font-weight:normal; color:#333; }
#ol_login .ol_btn_a { clear:both; text-align:center; background:red; padding:3px 0px; margin:5px 0px 0px; color:#fff; cursor:pointer; font:normal 11px dotum; }
#ol_login .ol_btn_a b {	display:block; line-height:1.8; }
#ol_login .ol_logout { clear:both; text-align:center; background:#333; border:1px solid #ddd; padding:6px 0px; margin:4px 0px 0px; font:normal 11px dotum; }
#ol_login .ol_logout b, #ol_login .ol_btn_a b { font-weight:normal; color:#fff; }
#ol_login .ol_new_memo { color:orangered; letter-spacing:0; }
#ol_login .ol_new_response { color:orangered; letter-spacing:0; }



그리고 


/amina/misc/outlogin/basic/outlogin.skin.php


82 ~ 93번째 줄도 수정 조금 해줬습니다.



<ul>
<li>
<label for="ol_mb_id" class="none">아이디</label><input type="text" name="mb_id" id="ol_mb_id" class="id_none" itemname="아이디" value="" tabindex="1">
<span style="font-size:10pt;line-height:1.6;background-color:transparent;"></li></span>
<li>
<label for="ol_mb_pw" class="none">비밀번호</label><input type="password" name="mb_password" id="ol_mb_pw" class="pw_none" itemname="비밀번호" value="" tabindex="2">
</li>
<li class="left"><input type="checkbox" name="auto_login" value="1" id="auto_login"> <label for="auto_login">자동로그인</label></li>
<li class="right"><input type="submit" class="login_submit" value="로그인" tabindex="3"></li>
<li class="join"><a href="<?php echo G5_BBS_URL; ?>/register.php"><b>회원가입</b></a> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <a href="<?php echo G5_BBS_URL; ?>/password_lost.php" class="w_password_lost"><b>아이디/비번 찾기</b></a></li>
<? include_once(G5_PLUGIN_PATH."/sns_login/sns_login.php");?> </span>
</ul>

관련자료

  • 서명
    우성짱의 NAS를 운영하고 있습니다.

    저의 즐거움이 여러분의 즐거움이면 좋겠습니다.

댓글 17 / 2 페이지

닥스훈트님의 댓글의 댓글

우성군님 정말 감사하게도 링크로 구글/페이스북/트위터 로그인은 해결했습니다.

그런데 네이버 로그인의 경우 아미나의 1초 로그인을 다운받아도 설정자체에 naver login.php 파일도 없고

이상하게 네이버 아이디로 로그인 서비스 입력을 다했는데 잘못된 요청이라고 나오면서 등록도 안되더라구요..

가입시에 pc랑 모바일 주소를 똑같이 입력해서 그럴까요? 그리고 네이버 php 파일 구성은 어찌해야 될까요..

그리고 가장 먼저 우성군님 홈피에 외부로그인 아이디/비밀번호 글자 안사라지는 문제해결 하셨던데 그 해결방법도 좀 알려주시면 안될까요?

우성군님의 댓글의 댓글

네이버 파일은 구 아미나 홈페이지에 있습니다.

거긴 100포인트가 있어야 받을 수 있어요.

그리고 외부로그읜 글자 안사라지는 문제는 메뉴에 있는 로그인을 빼니깐 해결 되더군요 ㅎㅎ

닥스훈트님의 댓글의 댓글

구 아미나 게시판은 즐겨찾기로도 안들어가지고.. 아이디랑 포인트도 못찾겠어요..


그리고 말씀대로 위에 메뉴에 있는 로그인을 없애도 똑같이 글자가 안사라져요.

처음에 우성군님 테마 적용할 때는 아이디 /비밀번호 글자가 잘 사라졌다가

위에 있는 메뉴의 로그인을 눌렀을 때 외부로그인창이랑 모양이 같아서 아미나 로그인창처럼

바꾸고나서 그 이후에 안됐더것도 같구요.


한번은 모바일로 접속할려고 하다가 로그인버튼 누르고 잘못해서 눕혀졌다가 정위치로 돌렸더니

아미나 로그인이 아니라 그누 외부로그인 창으로 바껴버리더라구요

(아마 이 부분에서 충돌? 혹은 오류 때문에 그런건가 싶기도 하구요. 그 외부로그인 팝업창은 글자도 잘 사라지고)

그래서 페이스북/구글/트위터 로그인하기도 적용했고 이 문제를 해결하려면

아미나 로그인창이 아니라 초창기 외부로그인버튼 (지금 우성군님이 살짝 변형했지만 적용해놓은 모바일 로그인모습처럼)

로그인 페이스북/구글/트위터 모양으로 해결해보면 되지 않을까도 생각하거든요.


지금 워낙 초보인 것도 문제지만 (구)아미나 질문게시판도 어딘지 모르겠고.. 예전 제 질문글도 못찾겠고..

지금 메뉴에 로그인버튼 삭제하고

우성군님 모바일처럼 페이스북/구글/트위터 로그인하기처럼 적용하려면 어찌해야 할까요?

죄송스럽지만 자세히 좀 알려주시면 안될까요...

우성군님의 댓글의 댓글

음.. 제가 적은 글이 전부입니다.

메뉴에 로그인을 없애는 문제는 header.php에서 login 관련 모든 줄을 삭제해야 합니다.

<!-- 이런 주석도 있으면 안되더군요...

일단 첫화면에 로그인이 하나만 있으면 글자가 잘 사라지구요.


모바일 로그인 적용은 그냥 위에 제가 적은게 끝입니다 ^^;; 더이상 어떻게 설명드려야할지 잘 모르겠습니다.


그리고 구아미나 홈페이지가 불안정하네요.

접속이 될 때도 있고 안될 때도 있군요. 아마 네임서버 쪽 캐시 문제인 것 같은데... 아무튼.. 해당 링크가 열리면 다시 한번 들어가보세요.

닥스훈트님의 댓글

우성군님 말씀 듣고 하나하나 삭제하고 적용해보고 해봤더니

위 메뉴에 로그인 버튼을 안지우고도 우연치 않게 해결 방법을 찾았습니다.

다른 건 냅둔 상태에서

amina/thema/basic/pc 에 있는 header.php 파일에서

120번째줄쯤에 있는

<!-- Login & Logout -->
<div id="at-outlogin-box" style="width:220px;display:none;">
<?php echo outlogin('amina'); ?>
</div>

요 부분을 삭제처리해줬더니 아이디/ 비밀번호 글자가 정상적으로 잘 사라집니다 ㅠ

근데 죄송하지만

모바일 로그인 화면을 우성군님 처럼 sns 도 뜨는 걸로 바꾸고 싶은데 방법 좀 알려주시면 안될까요?

우성군님의 댓글의 댓글

모바일 로그인 화면 수정이 바로 글 내용 중 밑 부분입니다.

<? include_once(G5_PLUGIN_PATH."/sns_login/sns_login.php");?>

위 내용을 아이디/비번 찾기 밑에 넣으면 됩니다.
전체 157 / 11 페이지
RSS

최근글


새댓글


알림 0