锶源昆仑会员+体验官

pages/bond/activation/index.wxss

@@ -0,0 +1,110 @@
+page {
+    background-color: #f4f4f4;
+}
+
+.tabs {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    z-index: 99;
+    display: flex;
+    background-color: #ffffff;
+}
+
+.tabs-item {
+    flex: 2;
+    text-align: center;
+    height: 90rpx;
+    line-height: 90rpx;
+    position: relative;
+}
+
+.tabs-item::after {
+    position: absolute;
+    width: 12%;
+    background-color: #1d37e2;
+    height: 6rpx;
+    border-radius: 60rpx;
+    content: '';
+    left: 44%;
+    bottom: 0;
+    display: none;
+}
+
+.tabs-item.show::after {
+    display: block;
+}
+
+.tabs-item.show {
+    color: #1d37e2;
+    font-weight: 600;
+}
+
+
+.list {
+    margin-top: 100rpx;
+    padding: 30rpx;
+    box-sizing: border-box;
+}
+
+.item {
+    background-color: #ffffff;
+    border-radius: 30rpx;
+    margin-bottom: 30rpx;
+    box-shadow: 0 0 5rpx rgba(0, 0, 0, .05);
+}
+
+.top {
+    padding: 0 30rpx;
+    box-sizing: border-box;
+    line-height: 110rpx;
+    border-bottom: 2rpx solid #eeeef0;
+    display: flex;
+}
+
+.code {
+    flex: 1;
+    font-weight: 600;
+    position: relative;
+    padding-left: 30rpx;
+}
+
+.code::after {
+    position: absolute;
+    content: '';
+    left: 0;
+    top: calc(50% - 7rpx);
+    width: 14rpx;
+    height: 14rpx;
+    border-radius: 50%;
+    background-color: #53c41a;
+}
+
+.copy {
+    border: 2rpx solid #1d37e2;
+    color: #1d37e2;
+    border-radius: 10rpx;
+    font-size: 28rpx;
+    height: 64rpx;
+    line-height: 62rpx;
+    padding: 0 20rpx;
+    box-sizing: border-box;
+    margin-top: 26rpx;
+}
+
+.label {
+    padding: 30rpx;
+    box-sizing: border-box;
+    display: flex;
+}
+
+.label-item {
+    flex: 2;
+}
+
+.label-name {
+    font-size: 30rpx;
+    color: #9d9d9d;
+    margin-bottom: 10rpx;
+}