/***** 【平台个人中心（UCenter）】样式文件 CSS Document *****/ @charset "utf-8"; /* =========================用户登录（Signer）.Start======================= */ #Signer{ position:absolute; top:0; left:0; right:0; bottom:0; background-color:#EBE2D3; min-width:1040px; min-height:640px; } /* 左侧展示 */ #Signer .displayer{ height:100%; width:50%; position:absolute; top:0; left:0; z-index:1; background-color:#7AF; overflow:hidden; } #Signer .displayer .signin-bg{ height:100%; width:auto; min-width:100%; position:absolute; top:0; left:0; z-index:1; } #Signer .displayer .txt-area{ height:100%; width:100%; position:absolute; top:0; left:0; z-index:2; background-color:rgba(0,0,0,.25); } #Signer .displayer .txt-area .company-logo{ float:left; width:100%; padding:30px 40px; } #Signer .displayer .txt-area .company-logo .the-logo{ float:left; height:28px; } #Signer .displayer .txt-area .company-logo .slogan{ float:left; width:160px; color:#F5F5F5; margin-top:8px; font-size:12px; clear:both; padding-left:3px; letter-spacing:2px; } #Signer .displayer .txt-area .login-txt{ float:left; width:100%; padding:30px 40px; position:absolute; bottom:40px; left:40px; } #Signer .displayer .txt-area .login-txt .welcome{ float:left; height:80px; font-size:80px; color:#FFF; font-weight:100; letter-spacing:5px; } #Signer .displayer .txt-area .login-txt .welcome-en{ float:left; width:100%; color:#FFF; margin-top:36px; font-size:18px; font-weight:100; } #Signer .displayer .txt-area .login-txt .deliver{ float:left; height:3px; background:#FFF; width:160px; margin-top:20px; border-radius:2px; } #Signer .displayer .txt-area .shelter{ background:url('../image/login_shelter.png') no-repeat no-repeat; width:140px; height:120px; line-height:116px; position:absolute; top:50%; right:0; margin-top:-50px; font-size:20px; color:#2878ff; padding-left:35px; letter-spacing:2px; } /* 快捷访问 */ #Signer .displayer .txt-area .quick-app{ float:left; width:100%; padding:30px 60px; position:absolute; bottom:20px; left:0; } #Signer .displayer .txt-area .quick-app .unit{ float:left; margin-right:20px; } #Signer .displayer .txt-area .quick-app .unit .welcome{ float:left; height:26px; font-size:16px; color:#FFF; font-weight:400; letter-spacing:2px; } #Signer .displayer .txt-area .quick-app .unit .welcome-en{ float:left; clear:both; color:#F5F5F5; font-size:12px; font-weight:100; } #Signer .displayer .txt-area .quick-app .unit .deliver{ float:left; height:2px; background:#F5F5F5; width:60%; margin-top:10px; border-radius:2px; } #Signer .displayer .txt-area .quick-app .unit:hover .deliver{ background:#F80; } #Signer .displayer .txt-area .quick-app .unit.go-shop:hover .deliver{ background:#11df4b; } /* 右侧登录 */ #Signer .loginer{ height:100%; width:50%; position:absolute; top:0; right:0; bottom:0; z-index:100; background-color:#FFF; } /* 登录面板 */ #Signer .loginer .sign-panel{ width:550px; height:440px; padding:10px 80px; position:relative; top:50%; margin-top:-240px; left:50%; margin-left:-300px;} /* 标题 */ #Signer .sign-panel .the-title h3{ font-size:28px; color:#222; font-weight:700; text-align:center; line-height:50px; margin:0 0 40px; } /*输入面板部分*/ #Signer .sign-panel .input-area{ } #Signer .sign-panel .input-area .layui-form-item{ margin-bottom:20px; position:relative; padding-left:44px; border-bottom:1px solid #ccc; padding-bottom:6px; } #Signer .sign-panel .input-area .layui-form-item .sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0, 0, 0, 0); border:0; } #Signer .sign-panel .input-area .layui-form-item .layui-form-label{ height:44px; width:44px; padding:0; position:absolute; left:0; border:none; background:none; } #Signer .sign-panel .input-area .layui-form-item .layui-form-label .icon{ background-color:#FFF; height:26px; width:26px; border-radius:50%; margin:12px 8px; } #Signer .sign-panel .input-area .layui-form-item .layui-form-label .icon i{ color:#CCC; font-size:20px; } #Signer .sign-panel .input-area .layui-form-item .layui-form-label .icon img{ height:100%; width:100%; border-radius:50%; } #Signer .sign-panel .input-area .layui-form-item .layui-input-inline{ width:100%; margin-right:0; margin-left:-1px; } #Signer .sign-panel .input-area .layui-form-item .layui-input-inline .layui-input{ height:44px; border:none; background:none; padding:0 10px; font-weight:bold; font-size:20px; line-height:18px; } #Signer .sign-panel .input-area .layui-form-item .layui-input-inline input:focus{ border-color:#27F !important; } #Signer .sign-panel .input-area .layui-form-item .layui-input-inline input::-webkit-input-placeholder { /* WebKit browsers */ font-weight:normal; font-size:18px; } #Signer .sign-panel .input-area .layui-form-item .layui-input-inline input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ font-weight:normal; font-size:18px; } #Signer .sign-panel .input-area .layui-form-item .layui-input-inline input::-moz-placeholder { /* Mozilla Firefox 19+ */ font-weight:normal; font-size:18px; } #Signer .sign-panel .input-area .layui-form-item .layui-input-inline input:-ms-input-placeholder { /* Internet Explorer 10+ */ font-weight:normal; font-size:18px; } #Signer .sign-panel .input-area .layui-form-item .verify-code input{ width:178px; float:left; } #Signer .sign-panel .input-area .layui-form-item .verify-code .verify_img{ float:right; width:100px; height:36px; border-radius:8px; position:relative; top:5px; } /*记住登录按钮*/ #Signer .sign-panel .input-area .login-links{ padding-left:1px; border:none; } #Signer .sign-panel .input-area .login-links .keep{ padding-left:12px; } #Signer .sign-panel .input-area .login-links .keep .layui-form-checkbox{ margin-left:0; margin-top:0; padding-left:25px; } #Signer .sign-panel .input-area .login-links .keep .layui-form-checkbox i{ font-weight:700; width:18px; height:18px; line-height:18px; } #Signer .sign-panel .input-area .login-links .keep .layui-form-checked[lay-skin=primary] i{ border-color:#27F; background-color:#27F; } #Signer .sign-panel .input-area .login-links .keep .layui-form-checkbox[lay-skin=primary]:hover i{ border-color:#27F; } /*登录按钮*/ #Signer .sign-panel .input-area .btn-signin{ width:100%; border-radius:5px; height:56px; line-height:56px; background-color:#27F; color:#FDFDFD; font-size:20px; letter-spacing:2px; } /* 版权信息 */ #Signer .loginer .copyright{ width:240px; position:absolute; bottom:30px; left:50%; margin-left:-150px; font-size:12px; color:#AAA; text-align:center; } /* =========================用户登录（Signer）.End======================= */ /* =========================个人中心左侧栏（#Usider）样式.Start======================= */ #Usider{ } /* 个人信息 */ #Usider .user-base-info{ text-align:center; padding-top:28px; position:relative; } /* 头像 */ #Usider .user-base-info .avatar-area{ position:relative; width:100px; height:100px; margin:0 auto; } #Usider .user-base-info .avatar-area .mid-avatar{ height:100px; width:100px; padding:4px; } #Usider .user-base-info .avatar-area .changetips{ position:absolute; top:0; left:0; height:100%; width:100%; border-radius:50%; line-height:100px; text-align:center; } #Usider .user-base-info .avatar-area .changetips span{ color:#FFF; font-size:14px; font-size:13px; display:none; } #Usider .user-base-info .avatar-area .changetips:hover{ background:rgba(100,100,100,0.7); cursor:pointer; } #Usider .user-base-info .avatar-area .changetips:hover .change-avatar{ display:block; } /* 昵称 */ #Usider .user-base-info .nickname{ width:100%; padding-top:20px; } #Usider .user-base-info .nickname .name-n{ color:#666; font-size:16px; display:block; margin-bottom:10px; } #Usider .user-base-info .nickname .name-m{ color:#888; font-size:13px; margin-left:1px; } /* 签名 */ #Usider .user-base-info .signature{ width:100%; padding:10px; color:#999; font-size:12px; line-height:18px; } /* 皮肤 */ #Usider .user-base-info .the-skin{ position:absolute; top:18px; right:20px; color:#C5C5C5; } #Usider .user-base-info .the-skin:hover{ color:#F52; cursor:pointer; } /* 用户菜单 */ #Usider .user-nav{ text-align:center; padding:15px 3px 0; } #Usider .user-nav li{ padding:2px 3px; } #Usider .user-nav li a{ display:block; height:38px; line-height:38px; text-decoration:none; color:#666; padding:0 15px 0 30px; -webkit-transition:all 0.25s ease; -o-transition:all 0.25s ease; transition:all 0.25s ease; border-radius:3px; } #Usider .user-nav li a .icon{ float:left; height:22px; line-height:22px; width:22px; margin:7px 0; text-align:center; } #Usider .user-nav li a .icon i{ color:#788; font-size:14px; } #Usider .user-nav li a .title{ float:left; color:#788; margin-left:5px; height:34px; overflow:hidden; width:96px; text-align:left; } #Usider .user-nav li a .tips{ float:right; color:#FFF; background:#CCC; height:16px; line-height:16px; padding:0 4px; border-radius:4px; font-size:12px; margin:9px 0; position:absolute; right:15px; max-width:40px; overflow:hidden; display:none; } #Usider .user-nav li a .tips.alert{ background:#f50; display:block; } #Usider .user-nav li a:hover{ box-shadow:0px 0px 10px #CCC; } #Usider .user-nav li a:hover .icon i,#Usider .user-nav li a:hover .title{ color:#111; } #Usider .user-nav li.current a{ background:#27F; border-color:#27F; box-shadow:2px 4px 10px 0 rgba(0,0,0,.1),2px 4px 15px -5px rgba(21,114,232,.4); } #Usider .user-nav li.current a .title, #Usider .user-nav li.current a i{ color:#F5F5F5; } #Usider .user-nav li.current a:hover .icon i,#Usider .user-nav li.current a:hover .title{ color:#FFF; } /* =========================个人中心左侧栏（#Usider）样式.End======================= */ /* =========================个人中心（#Uindex）样式.Start======================= */ #Uindex{ display:block; } /***头部***/ #Uindex .header{ width:100%; padding-top:120px; min-height:250px; background:url('../image/profile-bg.jpg') top left repeat-x #FFF; background-size:auto 200px; } #Uindex .header .avatar{ position:absolute; left:25px; z-index:100; } #Uindex .header .profiles{ width:100%;height:100%; padding-left:165px; position:relative; } #Uindex .header .profiles .name-line{ width:100%; margin-bottom:24px; padding-top:35px; float:left; } #Uindex .header .profiles .name-line .mem-name{ float:left; } #Uindex .header .profiles .name-line .mem-name span{ font-size:26px; color:#222; } #Uindex .header .profiles .name-line .last-login{ float:left; color:#444; font-size:14px; margin:12px 0 0 8px; } #Uindex .header .profiles .name-line .last-login span{ margin-left:5px; } #Uindex .header .profiles .info{ padding-top:18px; } #Uindex .header .profiles .info li{ display:inline-block; margin-right:18px; color:#333; vertical-align:middle; } #Uindex .header .profiles .info .line{ width:1px; height:16px; border-right:1px solid #DDD; } #Uindex .header .profiles .info li i{ margin-right:5px; font-size:16px; color:#BBB; vertical-align:-1px; } #Uindex .header .profiles .info li span.empty{ color:#CACACA; } #Uindex .header .profiles .action{ width:300px; text-align:right; position:absolute; right:20px; bottom:9px; } #Uindex .header .profiles .action .btn-edit{ height:32px; line-height:32px; border-radius:20px; background-color:#48F; padding:0 20px; } /***主体***/ #Uindex .manor{ width:100%; position:relative; margin-top:12px; } #Uindex .manor .com-panel{ margin-bottom:10px; } #Uindex .manor .com-panel .panel-head{ line-height:30px; font-size:14px; margin-bottom:5px; } #Uindex .manor .com-panel .panel-head .title{ color:#333; border-left:3px solid #48F; padding-left:8px; } #Uindex .manor .com-panel .panel-body{ line-height:30px; font-size:14px; } #Uindex .manor .com-panel .panel-body li{ display:-webkit-box; display:flex; display:-ms-flexbox; display:-webkit-flex; -ms-flex-direction:row; flex-direction:row; margin-bottom:5px; } #Uindex .manor .com-panel .panel-body li .title{ margin-right:20px; width:90px; text-align:right; color:#aaa; } #Uindex .manor .com-panel .panel-body li .value{ -webkit-box-flex:1; -ms-flex:1 1 0px; flex:1 1 0; -webkit-flex:1 1 0; color:#666; text-align:left; word-break:break-all; } #Uindex .manor .com-panel .panel-body li .value.empty{ color:#CACACA; } /* =========================个人中心（#Uindex）样式.End======================= */ /* =========================个人信息修改（#InfoSet）样式.Start======================= */ #InfoSet{ } #InfoSet .set-panel{ margin-bottom:12px; padding-bottom:0; } #InfoSet .set-panel .panel-title{ color: #666; border-bottom:1px solid #DDD; margin-bottom:26px; padding-bottom:10px; } #InfoSet .set-panel .panel-title span{ font-size:14px; font-weight:700; } #InfoSet .set-panel .panel-title i{ color:#777; line-height:32px; margin-right:6px; font-size:14px; } /* =========================个人信息修改（#InfoSet）样式.End======================= */ /* =========================个人消息(#Umessage)样式.Start======================= */ #Umessage{ } #Umessage .u-message{ } /* 标题 */ #Umessage .com-title{ color: #666; border-bottom:1px solid #DDD; margin-bottom:20px; padding-bottom:10px; } #Umessage .com-title span{ font-size:14px; font-weight:700; } #Umessage .com-title i{ color:#777; line-height:32px; margin-right:6px; font-size:14px; } /* 内容 */ #Umessage .data-area{ padding:5px 1px; } #Umessage .data-area .no-msg{ text-align:center; padding:100px; color:#999; } #Umessage .data-area .no-msg i{ font-size:20px; color:#FFC107; } #Umessage .data-area .no-msg img{ height:80px; display:block; margin:0 auto 20px; } #Umessage .data-area .no-msg span{ font-size:14px; margin-left:4px; } #Umessage .msg-list li{ float:left; width:100%; padding:0px 10px 5px; border-bottom:1px solid #DDD; margin-bottom:28px; } #Umessage .msg-list li.have-read{ border-left-color:#CCC; } #Umessage .msg-list li .line-cont{ float:left; width:100%; padding:15px 0; line-height:28px; color:#888; } #Umessage .msg-list li .line-cont .tips{ background:#F80; color:#fff; font-size:10px; padding:3px 8px; border-radius:12px; position:relative; top:-1px; } #Umessage .msg-list li .line-cont .tips.read{ background:#CCC; } #Umessage .msg-list li .line-cont strong{ color:#333; } #Umessage .msg-list li .line-cont .txt-content{ } #Umessage .msg-list li .line-other{ float:left; width:100%; } #Umessage .msg-list li .line-other .from{ float:left; color:#B5B5B5; height:26px; line-height:26px; } #Umessage .msg-list li .line-other .from .sender-img{ float:left; width:26px; height:26px; border-radius:50%; margin-right:9px; } #Umessage .msg-list li .line-other .from .sender-name{ color:#333; font-weight:700; margin-right:12px; } #Umessage .msg-list li .line-other .from span{ float:left; } #Umessage .msg-list li .line-other .read-btn{ float:right; } #Umessage .msg-list li .line-other .read-btn button{ border:none; padding:0 12px; border-radius:3px; color:#fff; background:#F80; font-size:13px; height:26px; line-height:26px; } #Umessage .msg-list li .line-other .read-btn button:hover{ cursor:pointer; background:#F70; } #Umessage .msg-list .show-page{ margin:15px 0; } /* =========================个人消息(#Umessage)样式.End======================= */ /* =========================我的积分(UScore).Start======================= */ /* 我的积分 */ #UScore{ padding:8px; } /* 概要信息 */ #UScore .base-data{ margin-bottom:12px; } #UScore .base-data .data-unit{ width:20%; float:left; padding:0 40px 0 10px; } #UScore .base-data .data-unit span{ color:#666; margin-right:10px; } #UScore .base-data .data-unit i{ font-size:14px; position:relative; } #UScore .base-data .data-unit em{ font-size:14px; color:#888; font-style:normal; } #UScore .base-data .data-unit.sum em{ font-size:14px; font-weight:700; color:#F90; } /* 积分列表 */ #UScore .score-list{ } /* 积分日志列表 */ #UScore .score-list .myscore-head{ font-size:14px; margin-bottom:12px; margin-left:3px; font-weight:700; color:#888; } #UScore .score-list .score-log-list .score-type i{ font-size:14px; position:relative; top:1px; margin-right:2px; } #UScore .score-list .score-log-list .score-type span{ color:#888; } /* =========================我的积分(UScore).End======================= */ /* =========================皮肤偏好设置（#Uskin）样式.Start======================= */ #Uskin{ } #Uskin .skin-list{ padding:20px; } #Uskin .skin-list .skin-unit{ float:left; position:relative; margin:10px 12px; padding:10px; border-radius:4px; } #Uskin .skin-list .skin-unit:hover{ background-color:#F8F8F8; } #Uskin .skin-list .skin-unit .choice-tips{ display:none; width:50px; height:46px; position:absolute; top:118px; right:6px; } #Uskin .skin-list .skin-unit .choice-tips.selected{ display:block; } #Uskin .skin-list .skin-unit .choice-tips img{ width:100%; height:100%; } #Uskin .skin-list .skin-unit .skin-cover{ width:200px; height:150px; } #Uskin .skin-list .skin-unit .skin-title{ padding-top:10px; text-align:center; font-size:13px; color:#888; } /* =========================皮肤偏好设置（#Uskin）样式.End======================= */