ux-personal-info-card/lib/style.st.js

import styled from 'styled-components';
import { $family } from '@beisen-phoenix/style-token';

var tobackImg = require('./icons/info-top-back.svg');

export var Wrap =
/*#__PURE__*/
styled.div(["width:340px;height:488px;position:relative;font-family:", ";"], $family);
export var CardTop =
/*#__PURE__*/
styled.div(["height:228px;position:relative;width:100%;top:0;"]);
export var AvatarWap =
/*#__PURE__*/
styled.div(["height:120px;cursor:pointer;width:120px;margin:0 auto;z-index:2;position:absolute;left:0;right:0;top:0px;border-radius:100%;box-shadow:0 0 14px 0 rgba(0,0,0,0.20);"]);
export var TopBack =
/*#__PURE__*/
styled.div(["width:100%;height:48px;z-index:2;position:absolute;bottom:0;background:url(", ") 50% 50% no-repeat;"], tobackImg);
export var CardBottom =
/*#__PURE__*/
styled.div(["width:100%;height:428px;background:#EBF7FF;border-radius:0 0 5px 5px;position:absolute;top:50px;box-shadow:0 0 20px 0 rgba(0,0,0,0.10);"]);
export var BottomTopBack =
/*#__PURE__*/
styled.div(["width:100%;height:178px;z-index:1;background-image:linear-gradient(90deg,#8972f6 0%,#4989ec 35%,#00aeed 68%,#49d0ff 100%);border-radius:5px 5px 0 0;"]);
export var ListWrap =
/*#__PURE__*/
styled.ul(["padding:10px 10px;overflow-y:auto;box-sizing:content-box;width:calc(100% - 20px);height:calc(100% - 198px);margin:0;"]);
export var CardListWrap =
/*#__PURE__*/
styled.div(["width:300px;margin:10px 14px 0 24px;margin-top:10px;z-index:2;position:absolute;top:130px;}"]);