body {
|
color: #1e2329;
|
font-family: "Microsoft YaHei";
|
min-width: 1200px;
|
}
|
|
/* 内容区域 */
|
.content-view-box {
|
width: 1200px;
|
margin: 0 auto;
|
/* background-color: #03A66D; */
|
}
|
|
/* 主题色调 */
|
.theme-color {
|
color: #fdd435;
|
}
|
|
/* 灰色字体 */
|
.linght-grey-color {
|
color: #707a8a;
|
}
|
|
/* 纯黑字体 */
|
.black-color {
|
color: #000;
|
}
|
|
.white-color {
|
color: white;
|
}
|
|
/* 浅灰色背景*/
|
.light-background-color {
|
background-color: #fafafa;
|
}
|
|
/* 黄色按钮 */
|
.theme-button {
|
min-width: 100px;
|
height: 40px;
|
line-height: 40px;
|
background-color: #1d91ff;
|
color: rgb(255, 255, 255);
|
border-radius: 5px;
|
outline: none;
|
border: none;
|
cursor: pointer;
|
font-size: 15px;
|
margin-right: 10px;
|
}
|
|
.theme-button:hover {
|
transition: all 0.5s;
|
background-color: #1d9fff;
|
}
|
|
/* 浅灰色按钮 */
|
.light-grey-button {
|
min-width: 100px;
|
height: 40px;
|
line-height: 40px;
|
background-color: #e9ecef;
|
color: rgb(24, 26, 32);
|
border-radius: 4px;
|
outline: none;
|
border: none;
|
cursor: pointer;
|
font-size: 15px;
|
margin-right: 10px;
|
padding: 0 10px;
|
}
|
|
/* 登录后的布局样式 */
|
.box-view {
|
display: flex;
|
height: 100vh;
|
}
|
|
.left-view {
|
min-width: 235px;
|
border-right-style: solid;
|
border-right-width: 1px;
|
border-right-color: #e5e5e5;
|
background-color: white;
|
}
|
|
.right-view {
|
flex-grow: 1;
|
background-color: white;
|
/* background-color:#fafafa; */
|
}
|
|
.right-title {
|
font-size: 28px;
|
line-height: 32px;
|
font-weight: bold;
|
}
|
|
.right-padding {
|
padding: 15px 20px;
|
}
|
|
/* 左侧边菜单选中的样式,主色调黄色 */
|
.menu-active-color {
|
background-color: #f5f5f5;
|
border-left: 4px solid #1d91ff;
|
font-weight: 500;
|
}
|
|
.menu-list {
|
height: 50px;
|
display: flex;
|
flex-direction: row;
|
align-items: center;
|
}
|
|
.menu-list > img {
|
width: 40px;
|
height: 40px;
|
}
|
|
.menu-list:hover {
|
background-color: #f5f5f5;
|
cursor: pointer;
|
}
|
|
.menu-list > span {
|
font-size: 14px;
|
}
|
|
/* 左侧菜单icon样式 */
|
.icon-style {
|
font-size: 20px;
|
padding-right: 10px;
|
color: #848e9c;
|
}
|
|
/* 左右箭头 */
|
.arrow-left-icon,
|
.arrow-right-icon {
|
color: #848e9c;
|
padding: 0 20px;
|
}
|
|
.page-num {
|
color: #409eff;
|
font-weight: bold;
|
}
|
|
.page-box {
|
text-align: center;
|
margin-top: 35px;
|
}
|
|
/* 鼠标样式 */
|
.mouse-cursor {
|
cursor: pointer;
|
}
|
|
/* 文字颜色样式 */
|
.green {
|
color: #03a66d;
|
}
|
|
.red {
|
color: #cf304a;
|
}
|
|
.yellow {
|
color: #eed84e;
|
}
|
|
.white {
|
color: #ffffff;
|
}
|
|
.black {
|
color: #000000;
|
}
|
|
.blue {
|
color: #2c78f8;
|
}
|
|
/* 字体大小 */
|
.font-size12 {
|
font-size: 12px;
|
}
|
|
.font-size13 {
|
font-size: 13px;
|
}
|
|
.font-size14 {
|
font-size: 14px;
|
}
|
|
.font-size16 {
|
font-size: 16px;
|
}
|
|
.font-size18 {
|
font-size: 18px;
|
}
|
|
.font-size20 {
|
font-size: 20px;
|
}
|
|
.font-size22 {
|
font-size: 22px;
|
}
|
|
.font-size24 {
|
font-size: 24px;
|
}
|
|
.font-size26 {
|
font-size: 26px;
|
}
|
|
.font-size28 {
|
font-size: 28px;
|
}
|
|
.font-size30 {
|
font-size: 30px;
|
}
|
|
.font-size32 {
|
font-size: 32px;
|
}
|
|
.font-size38 {
|
font-size: 38px;
|
}
|
|
.font-size40 {
|
font-size: 40px;
|
}
|
|
.font-size45 {
|
font-size: 45px;
|
}
|
|
.font-size62 {
|
font-size: 62px;
|
}
|
|
.font-size70 {
|
font-size: 70px;
|
}
|
|
/* 文字加粗 */
|
.font-bold {
|
font-weight: bold;
|
}
|
|
/* flex布局 */
|
.flex-space {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
}
|
|
.flex-space-around {
|
display: flex;
|
justify-content: space-around;
|
align-items: center;
|
}
|
|
.flex-row-center {
|
display: flex;
|
flex-direction: row;
|
align-items: center;
|
}
|
|
.flex-justify-align-center {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.justify-center {
|
justify-content: center;
|
}
|
|
.justify-flex-start {
|
justify-content: flex-start;
|
}
|
|
/* 元素尾数对齐 */
|
.justify-flex-end {
|
justify-content: flex-end;
|
}
|
|
.align-center {
|
align-items: center;
|
}
|
|
/* 内间距上下30 */
|
.padding-top-bottom30 {
|
padding: 30px 0;
|
}
|
|
/* 内间距上下15 */
|
.padding-top-bottom20 {
|
padding: 20px 0;
|
}
|
|
/* 内间距上下15 */
|
.padding-top-bottom15 {
|
padding: 15px 0;
|
}
|
|
/* 外间距上下10 */
|
.margin-top-bottom10 {
|
margin: 10px 0;
|
}
|
|
/* 外间距上下20 */
|
.margin-top-bottom20 {
|
margin: 20px 0;
|
}
|
|
/* 外间距上下50 */
|
.margin-top-bottom50 {
|
margin: 50px 0;
|
}
|
|
/* 外间距上20 */
|
.margin-top20 {
|
margin-top: 20px;
|
}
|
|
/*外间距下 20 */
|
.margin-bottom20 {
|
margin-bottom: 20px;
|
}
|
|
/*外间距上 50 */
|
.margin-top50 {
|
margin-top: 50px;
|
}
|
|
/*外间距上 30 */
|
.margin-top30 {
|
margin-top: 30px;
|
}
|
|
/*外间距下 50 */
|
.margin-bottom50 {
|
margin-bottom: 50px;
|
}
|
|
/*外间距下 30 */
|
.margin-bottom30 {
|
margin-bottom: 30px;
|
}
|
|
/* 左外间距离10 */
|
.margin-left10 {
|
margin-left: 10px;
|
}
|
|
/* 左外间距离20 */
|
.margin-left20 {
|
margin-left: 20px;
|
}
|
|
/* 右外间距离10 */
|
.margin-right10 {
|
margin-right: 10px;
|
}
|
|
/* 右外间距离20 */
|
.margin-right20 {
|
margin-right: 20px;
|
}
|
|
/* 内间距 */
|
.padding-left-right20 {
|
padding: 0 20px;
|
}
|
|
.padding-top-bottom50 {
|
padding: 50px 0;
|
}
|
|
/* width 100 */
|
.width100 {
|
width: 100%;
|
}
|
|
/* 文本居中显示 */
|
.text-center {
|
text-align: center;
|
}
|
|
/* 文本居右 */
|
.text-right {
|
text-align: right;
|
}
|
|
/* 文本居右 */
|
.text-left {
|
text-align: left;
|
}
|
|
/*充值(提币)未到账内容块*/
|
.recharge-question-box {
|
border: 1px solid #e5e5e5;
|
padding: 15px;
|
margin: 10px 0;
|
}
|
|
.recharge-question-text {
|
margin-top: 10px;
|
margin-bottom: 10px;
|
}
|
|
.recharge-question-text > div {
|
line-height: 25px;
|
}
|
|
/* 主按钮颜色,全局修改 */
|
.el-button--primary {
|
/* background-color:rgb(252, 213, 53) !important;
|
border-color:rgb(252, 213, 53) !important; */
|
color: #fff !important;
|
}
|
|
.el-button--primary:hover {
|
/* background-color:rgb(252, 213, 53) !important;
|
border-color:rgb(252, 213, 53) !important; */
|
background: #1d91ff !important;
|
}
|
|
/* tab选项卡颜色 */
|
.el-tabs__item {
|
color: rgb(112, 122, 138) !important;
|
font-size: 16px !important;
|
}
|
|
.el-tabs__item.is-active {
|
color: rgb(30, 35, 41) !important;
|
font-weight: 500;
|
}
|
|
/* hover灰色 */
|
.el-tabs__item:hover {
|
color: rgb(30, 35, 41) !important;
|
cursor: pointer;
|
}
|
|
.el-tabs__active-bar {
|
background-color: #1d91ff !important;
|
}
|
|
/* 自定义tab按钮切样样式 */
|
.tab-customize-box {
|
width: 500px;
|
display: flex;
|
flex-direction: row;
|
margin: 30px 0;
|
}
|
|
.tab-customize {
|
padding: 0 10px;
|
height: 40px;
|
line-height: 40px;
|
text-align: center;
|
border-radius: 3px;
|
margin-right: 10px;
|
color: rgb(112, 122, 138);
|
cursor: pointer;
|
}
|
|
.tabActive {
|
/* background-color: #fef6d8;
|
color: #c99400; */
|
background-color: #1d91ff;
|
opacity: 0.8;
|
color: #fff;
|
}
|
|
/* 遮罩层 */
|
.v-modal {
|
position: fixed !important;
|
left: 0 !important;
|
top: 0 !important;
|
width: 100% !important;
|
height: 100% !important;
|
background-color: rgba(0, 0, 0, 0.5) !important;
|
}
|
|
/* 展开文本样式修改 */
|
.el-collapse-item__header {
|
font-size: 16px;
|
}
|
|
.el-collapse-item__content {
|
font-size: 15px;
|
}
|
|
/* 上传图像样式 */
|
.avatar-uploader .el-upload {
|
border: 1px dashed #d9d9d9;
|
border-radius: 6px;
|
cursor: pointer;
|
position: relative;
|
overflow: hidden;
|
}
|
|
.avatar-uploader .el-upload:hover {
|
border-color: #409eff;
|
}
|
|
.avatar-uploader-icon {
|
font-size: 28px;
|
color: #8c939d;
|
width: 178px;
|
height: 178px;
|
line-height: 178px;
|
text-align: center;
|
}
|
|
.avatar {
|
width: 178px;
|
height: 178px;
|
display: block;
|
}
|
|
/* 认证文字样式 */
|
.identify-text {
|
font-size: 16px;
|
font-weight: bold;
|
position: relative;
|
bottom: 5px;
|
margin-left: 10px;
|
}
|
|
/* 右边内容头部 */
|
.right-header {
|
background-color: #fafafa;
|
}
|
|
.right-header-box {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
padding: 25px 20px;
|
}
|
|
.right-header-box > div {
|
font-size: 28px;
|
font-weight: 500;
|
}
|
|
/* 资产估值样式 */
|
.asset-box {
|
border-bottom: 1px solid #e5e5e5;
|
padding-top: 3px;
|
padding-bottom: 20px;
|
}
|
|
.assets-title > p {
|
font-size: 18px;
|
color: rgb(30, 35, 41);
|
font-weight: bold;
|
}
|
|
.assets-size {
|
font-size: 26px;
|
font-weight: bold;
|
}
|
|
.assets-black {
|
color: rgb(30, 35, 41);
|
}
|
|
.assets-grey {
|
color: rgb(112, 122, 138);
|
}
|
|
/* 隐藏0资产样式 */
|
.el-checkbox__inner {
|
width: 20px;
|
height: 20px;
|
}
|
|
.el-checkbox__inner::after {
|
height: 12px;
|
left: 7px;
|
}
|
|
.el-checkbox__label {
|
font-size: 16px;
|
}
|
|
/* 弹窗,理财,矿机详情,充值,提现详情 */
|
.dialog-style {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.dialog-content {
|
margin: 20px;
|
}
|
|
.dialog-content > p {
|
margin: 10px 0;
|
}
|
|
/* el-image图片 */
|
.el-img-style {
|
height: 26px;
|
margin-right: 5px;
|
}
|
|
.flex-col {
|
flex-direction: column;
|
}
|
|
.justify-between {
|
justify-content: space-between;
|
}
|
|
.justify-around {
|
justify-content: space-around;
|
}
|
|
.justify-evenly {
|
justify-content: space-evenly;
|
}
|
|
.justify-start {
|
justify-content: flex-start;
|
}
|
|
.justify-end {
|
justify-content: flex-end;
|
}
|
|
.justify-center {
|
justify-content: center;
|
}
|
|
.items-start {
|
align-items: flex-start;
|
}
|
|
.items-end {
|
align-items: flex-end;
|
}
|
|
.items-center {
|
align-items: center;
|
}
|