zhongping-miniprogram/miniprogram/pages/reportPreview/reportPreview.scss

917 lines
16 KiB
SCSS

/* pages/reportPreview/reportPreview.wxss */
.tabs {
display: flex;
justify-content: space-between;
padding-left: 168rpx;
padding-right: 171rpx;
padding-top: 37rpx;
padding-bottom: 27rpx;
.tab {
.line {
width: 56rpx;
height: 5rpx;
background: #3A61B1;
border-radius: 2rpx;
margin: 11rpx auto;
}
}
}
.logoBar {
height: 127rpx;
width: 100%;
background: url('https://chrivc.obs.cn-north-4.myhuaweicloud.com/9d4b35f14e084bdf979c7ef1c8e731e1:sfiOtbXMKv1bceed8e62f91b52e158f7fec2bd81665b.png');
display: flex;
align-items: center;
justify-content: center;
.logoBar_logo {
width: 194rpx;
height: 38rpx;
}
}
.logoBar2 {
width: 100%;
height: 384rpx;
background: url('https://chrivc.obs.cn-north-4.myhuaweicloud.com/ec5a7d62161e4d3396914dc3cf74033a:附件_1660644161.png');
background-size: cover;
.slogan {
width: 636rpx;
height: 47rpx;
padding: 39rpx 60rpx 0 54rpx;
}
.mechanism {
font-size: 18rpx;
font-family: PingFang SC;
font-weight: 400;
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
margin-top: 20rpx;
align-items: center;
// line-height: 20rpx;
.ws{
word-spacing: 10rpx;
}
.icon_gh {
width: 32rpx;
height: 32rpx;
margin-right: 15rpx;
}
.icon_zgfw {
width: 33rpx;
height: 32rpx;
// margin-left: 27rpx;
margin-right: 18rpx;
}
// .mItem {
// display: flex;
// align-items: center;
// }
}
.description {
font-size: 20rpx;
font-family: PingFang SC;
font-weight: 400;
color: #A2BAEA;
line-height: 36rpx;
border: 1rpx solid rgba(255, 255, 255, .52);
padding: 20rpx 36rpx;
margin: 24rpx 54rpx 0 54rpx;
box-sizing: border-box;
}
}
.certificate {
padding: 0rpx 30rpx 150rpx 30rpx;
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
.title {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: bold;
color: #494949;
line-height: 41rpx;
text-align: center;
margin-top: 41rpx;
margin-bottom: 35rpx;
text {
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
color: #C3C3C3;
line-height: 41rpx;
}
}
.certificate_bg {
height: 985rpx;
width: 100%;
// background: url('https://chrivc.obs.cn-north-4.myhuaweicloud.com/4ad640afed3c4fc6bd6996d77597cce0:组 1 拷贝 5.png');
background: url('https://chrivc.obs.cn-north-4.myhuaweicloud.com/a1a71dad25764d2fb8dad47a27d49b30:电子证书@2x.png');
background-size: cover;
padding: 340rpx 109rpx 142rpx 112rpx;
box-sizing: border-box;
.title {
font-size: 48rpx;
font-family: Source Han Serif CN;
font-weight: bold;
color: #393939;
// line-height: 80rpx;
}
.info {
font-size: 19rpx;
font-family: PingFang SC;
font-weight: 400;
color: #6E6E6E;
// line-height: 69rpx;
view {
margin-bottom: 20rpx;
}
}
.description {
font-size: 19rpx;
font-family: PingFang SC;
font-weight: 500;
color: #393939;
line-height: 34rpx;
margin-bottom: 10rpx;
// text-align: center;
}
.blockInfo {
font-size: 15rpx;
font-family: PingFang SC;
font-weight: 400;
color: #6E6E6E;
line-height: 28rpx;
text-align: center;
.time-box {
display: flex;
justify-content: space-between;
}
.blockchain {
display: flex;
flex-direction: column;
align-items: flex-start;
}
.blockchain-number {
width: 400rpx;
word-break: break-all;
text-align: left;
}
.blur {
filter: blur(1px);
}
}
.bottom {
display: flex;
justify-content: space-between;
// align-items: flex-end;
margin-top: 40rpx;
.qr {
font-size: 13rpx;
font-family: PingFang SC;
font-weight: 400;
color: #6E6E6E;
line-height: 20rpx;
display: flex;
align-items: flex-end;
.scanTip {
margin-left: 20rpx;
}
.myQrcode {
width: 150rpx;
height: 150rpx;
}
}
.icon_zhang {
width: 163rpx;
height: 163rpx;
}
}
}
.example {
text-align: center;
font-size: 26rpx;
font-family: PingFang SC;
font-weight: 700;
color: #d60000;
// line-height: 20rpx;
}
.qrBox {
width: 429rpx;
height: 546rpx;
background: url('https://chrivc.obs.cn-north-4.myhuaweicloud.com/cab0fd6a9335480bbc882968f5a356f4:组 1 拷贝 6.png');
// background-size: 100% 100%;
background-size: cover;
box-sizing: border-box;
padding-top: 165rpx;
display: flex;
flex-direction: column;
align-items: center;
// margin-bottom: 45rpx;
.title {
display: flex;
align-items: center;
font-size: 48rpx;
font-family: Source Han Serif CN;
font-weight: bold;
color: #3A61B1;
line-height: 85rpx;
image {
width: 42rpx;
height: 43rpx;
margin-right: 20rpx;
}
}
.subTitle {
font-size: 23rpx;
font-family: PingFang SC;
font-weight: 400;
color: #3A61B1;
line-height: 41rpx;
}
.qrBox_bg {
width: 293rpx;
height: 293rpx;
border-radius: 10px;
background-color: #fff;
// margin-top: 38rpx;
padding: 20rpx;
box-sizing: border-box;
margin-top: 10rpx;
image {
width: 100%;
height: 100%;
}
}
}
// qrbg
// https://chrivc.obs.cn-north-4.myhuaweicloud.com/62f4eda34e5649af9048287e402f473a:3jOaUKY2SALiec5a608f7c9ddfe5e35747c2cbe61754.png
}
.report {
padding: 28rpx 30rpx 0rpx 30rpx;
.topTitleLayout {
// background: rgba(236, 238, 243, 0.46);
// border: 1px solid #F3F5F8;
text-align: center;
padding: 35rpx 0 37rpx;
// margin-bottom: 37rpx;
display: flex;
align-items: center;
justify-content: space-between;
.line {
background: #ECEEF3;
border: 1px solid #F3F5F8;
width: 130rpx;
height: 9rpx;
}
.title {
font-size: 40rpx;
font-family: PingFang SC;
font-weight: bold;
color: #3A61B1;
margin-bottom: 17rpx;
// line-height: 50px;
padding-left: 46rpx;
padding-right: 46rpx;
}
.date {
font-size: 22rpx;
font-family: PingFang SC;
font-weight: 500;
color: #838383;
}
}
.topTip {
font-size: 20rpx;
font-family: PingFang SC;
font-weight: 400;
color: #647295;
line-height: 34rpx;
text {
font-weight: 600;
color: #2B4585;
}
}
.icon_source {
width: 21rpx;
height: 21rpx;
margin-right: 10rpx;
}
.sourceList {
margin-top: 28rpx;
.sourceItem {
margin-bottom: 33rpx;
font-size: 22rpx;
font-family: PingFang SC;
font-weight: 400;
color: #838383;
&:last-child {
margin-bottom: 0;
}
}
}
.toolbar {
// border-bottom: 23rpx solid #F3F5F8;
margin-top: 40rpx;
background: #F3F5F8;
padding: 28rpx;
// padding: 8rpx;
.switchLayout {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 26rpx;
font-family: PingFang SC;
font-weight: 500;
color: #494949;
.switchShow {
background: #737373 !important;
text {
width: 32rpx;
height: 32rpx;
border-radius: 16rpx;
background: #FFFFFF;
position: relative;
left: 6rpx;
transition: all .5s;
}
.show {
left: 40rpx;
}
}
.switch {
width: 80rpx;
height: 40rpx;
background: #D1DEF9;
border-radius: 22rpx;
display: flex;
align-items: center;
margin-right: 24rpx;
text {
width: 32rpx;
height: 32rpx;
border-radius: 16rpx;
background: #FFFFFF;
position: relative;
left: 6rpx;
transition: all .5s;
}
.show {
left: 44rpx;
}
}
}
}
.item_icon {
width: 65rpx;
height: 65rpx;
margin-right: 37rpx;
}
.fold {
width: 25rpx;
height: 14rpx;
flex-shrink: 0;
transform: rotate(180deg);
}
.unfold {
width: 25rpx;
height: 14rpx;
flex-shrink: 0;
}
.list {
.item {
padding: 45rpx 0 44rpx 0;
border-bottom: 3px solid #F3F5F8;
&:last-child {
border-bottom: 0;
}
.value {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #494949;
margin-bottom: 19rpx;
display: flex;
}
.item_panel {
display: flex;
justify-content: space-between;
align-items: center;
.item_title {
flex: 1;
display: flex;
justify-content: space-between;
align-items: center;
text {
font-size: 34rpx;
font-family: PingFang SC;
font-weight: bold;
color: #282828;
line-height: 50rpx;
}
}
}
.item_content {
.flex {
display: flex;
align-items: baseline;
}
.value_item {
margin-top: 51rpx;
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #282828;
line-height: 50rpx;
display: flex;
.valueList {
.valueItem {
margin-bottom: 45rpx;
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #494949;
display: flex;
&:last-child {
margin-bottom: 0;
}
}
}
}
.addressList {
.addressItem {
margin-top: 31rpx;
// &:last-child{
// margin-bottom: 0;
// }
.source {
font-size: 20rpx;
font-family: PingFang SC;
font-weight: 500;
color: #C3C3C3;
}
}
}
}
}
}
}
.footer {
padding: 50rpx 0 120rpx 0;
.reportCreateDate {
display: flex;
align-items: center;
justify-content: center;
margin-top: 35rpx;
.line {
width: 50rpx;
height: 1px;
background: #D3D3D3;
}
.text {
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
color: #838383;
margin: 0 17rpx 0 17rpx;
}
}
.foot_logobar {
height: 74rpx;
width: 100%;
}
.topbar {
background: rgba(58, 97, 177, .25);
width: 100%;
height: 74rpx;
padding: 0 -30rpx 0 -30rpx;
}
.title {
font-size: 26rpx;
font-family: PingFang SC;
font-weight: 500;
color: #000000;
margin: 50rpx 60rpx 25rpx 50rpx;
.icon_warning {
width: 20rpx;
height: 20rpx;
margin-right: 8rpx;
}
}
.content {
font-size: 22rpx;
font-family: PingFang SC;
font-weight: 400;
color: #838383;
line-height: 36rpx;
opacity: 0.61;
padding: 0 60rpx 0 50rpx;
view {
margin-bottom: 29rpx;
}
}
}
.gray {
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
color: #838383;
line-height: 42rpx;
}
.eduList {
padding: 0 15rpx 0 21rpx;
.eduItem {
margin-top: 47rpx;
.eduTitle {
.eduName {
display: flex;
align-items: center;
font-size: 32rpx;
font-family: PingFang SC;
font-weight: bold;
color: #282828;
}
.eduDate {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
color: #838383;
margin-top: 21rpx;
}
}
.infos {
font-size: 26rpx;
font-family: PingFang SC;
font-weight: 500;
color: #494949;
line-height: 30px;
margin-top: 30rpx;
text {
border-right: 2px solid #E5E5E6;
padding-right: 10rpx;
padding-left: 10rpx;
&:last-child {
border-right: 0;
padding-right: 0;
}
&:first-child {
padding-left: 0;
}
}
}
.classInfo {
font-size: 26rpx;
font-family: PingFang SC;
font-weight: 500;
color: #494949;
line-height: 30rpx;
margin-top: 35rpx;
margin-bottom: 41rpx;
}
}
}
.eventList {
.eventItem {
display: flex;
position: relative;
padding-left: 30rpx;
justify-content: space-between;
align-items: flex-start;
&:not(:first-child) {
padding-top: 62rpx;
}
&::before {
content: '';
width: 10rpx;
height: 10rpx;
background: #3A61B1;
border-radius: 50%;
position: absolute;
left: 0;
top: 74rpx;
z-index: 1;
}
&::after {
content: '';
border: 2rpx solid #EAEAEA;
position: absolute;
left: 2rpx;
top: 0;
z-index: 0;
height: calc(100% - 0rpx);
}
&:first-child {
&::before {
content: '';
width: 10rpx;
height: 10rpx;
background: #3A61B1;
border-radius: 50%;
position: absolute;
left: 0;
top: 10rpx;
}
&::after {
content: '';
border: 2rpx solid #EAEAEA;
position: absolute;
left: 2rpx;
top: 20rpx;
height: calc(100% - 24rpx);
}
}
.eventDate {
margin-bottom: 21rpx;
}
}
}
.eventTitle {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #282828;
line-height: 50rpx;
margin-top: 49rpx;
margin-bottom: 44rpx;
}
.fileBox {
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
color: #C3C3C3;
line-height: 30rpx;
.icon_file {
width: 36rpx;
height: 36rpx;
margin-right: 9rpx;
}
}
// .mt35{
// margin-top: 35rpx;
// }
.mt41 {
margin-top: 41rpx;
}
.mb28 {
margin-bottom: 28rpx;
}
.mt30 {
margin-top: 30rpx;
}
.btnLayout {
// margin-top: 45rpx;
margin-bottom: 52rpx;
position: fixed;
bottom: 0;
width: 100%;
display: flex;
align-items: center;
justify-content: space-around;
z-index: 2;
}
.fixed {
position: fixed;
right: 30rpx;
bottom: 20%;
font-size: 22rpx;
font-family: PingFang SC;
font-weight: 500;
color: #C3C3C3;
line-height: 30px;
.toggleAll {
width: 90rpx;
height: 90rpx;
border-radius: 16rpx;
border: 2rpx solid rgba(180, 180, 180, .7);
margin-bottom: 15rpx;
box-sizing: border-box;
padding: 20rpx;
line-height: 28rpx;
display: flex;
justify-content: center;
align-items: center;
background: #fff;
}
.goTop {
width: 90rpx;
height: 90rpx;
border-radius: 16rpx;
border: 2rpx solid rgba(180, 180, 180, .7);
box-sizing: border-box;
line-height: 28rpx;
display: flex;
justify-content: center;
align-items: center;
background: #fff;
display: flex;
flex-direction: column;
.icon_top {
width: 21rpx;
height: 26rpx;
}
}
}
.canvas {
position: fixed;
opacity: 0;
left: 200%;
top: 200%;
z-index: -10;
&.card {
width: 253px;
height: 253px;
}
&.myQrcode {
width: 105px;
height: 105px;
}
}
.bottom-fill {
height: 225rpx;
}
.bottom-container {
height: 225rpx;
display: flex;
justify-content: space-around;
align-items: center;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
box-shadow: 0 0 20rpx #CCCCCC;
background: #fff;
.btn-item {
display: flex;
flex-direction: column;
align-items: center;
font-size: 22rpx;
font-family: PingFang SC;
font-weight: 500;
color: #8D8D8D;
background: #fff;
margin: 0;
padding: 0;
width: 154rpx;
// height: 152rpx;
text {
font-size: 20rpx;
}
image {
width: 92rpx;
height: 92rpx;
margin-bottom: 12rpx;
}
}
}
.drainage {
display: flex;
align-items: center;
justify-content: center;
position: fixed;
bottom: 40rpx;
left: 50%;
right: 50%;
}