[最新]

pages/user/code/code.wxss

@@ -1,164 +1,18 @@
-.code {
-    width: 100vw;
-    height: 100vh;
-    position: relative;
-}
 
-.code-back {
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 100%;
-    height: 100%;
-}
+.content{ display: flex; align-items: center; flex-direction: column; justify-content: center; background: white; box-shadow: brown; min-height: 100vh;}
 
-.code-cont {
-    width: 450rpx;
-    position: absolute;
-    z-index: 9;
-    text-align: center;
-    right: 0;
-    bottom: 13%;
-}
+/* 海报预览 */
+.poster{ width: 550rpx; height: 900rpx; background: white; box-shadow: 0 0 10rpx 10rpx rgba(0, 0, 0, .05); border-radius: 20rpx; overflow: hidden; }
+.poster-item{ width: 550rpx; height: 900rpx; background-position: center; background-size: cover; position: relative; }
+.poster-qrocde{ position: absolute; background-color: white; padding: 10rpx;}
 
-.code-img{
-    margin: 0 auto 20rpx;
-    overflow: hidden;
-    width: 220rpx;
-    height: 220rpx;
-    border: 4rpx solid #000;
-    background-color: #ffffff;
-    padding: 10rpx;
-    box-sizing: border-box;
-}
-
-.code-img image {
-    width: 100%;
-}
-
-.code-text {
-    color: #000;
-    font-size: 26rpx;
-    font-weight: 600;
-}
-
-.code-share {
-    position: absolute;
-    z-index: 10;
-    right: 0;
-    bottom: 40%;
-    background: linear-gradient(to right, #3f7fff, #568fff);
-    width: 50rpx;
-    text-align: center;
-    border-radius: 26rpx 0 0 26rpx;
-    padding: 24rpx 4rpx 24rpx 10rpx;
-    box-shadow: 0 0 6rpx 6rpx rgba(0, 0, 0, .2);
-}
-
-.code-share-name {
-    writing-mode:vertical-rl;
-    font-size: 28rpx;
-    padding-left: 4rpx;
-    color: #fff;
-}
-
-.code-share image {
-    width: 30rpx;
-    height: 30rpx;
-    margin-bottom: 5rpx;
-}
-
-.sharePop {
-    position: fixed;
-    width: 100%;
-    z-index: 99;
-    left: 0;
-    bottom: 0;
-    background-color: #0a1930;
-    display: none;
-}
-
-.sharePop.active {
-    display: block;
-}
-
-.shareCont-label image {
-    width: 60rpx;
-    height: 60rpx;
-    display: block;
-    margin: 0 auto 10rpx;
-}
-
-.shareCancel {
-    border-top: 2rpx solid #0e2c58;
-    color: #ffffff;
-    width: 100%;
-    text-align: center;
-    line-height: 100rpx;
-}
-
-.shareCont{
-    display: flex;
-    padding: 30rpx 0;
-}
-
-.shareCont-label {
-    color: #ffffff;
-    flex: 2;
-    text-align: center;
-    font-size: 28rpx;
-}
-
-.codeShare-button {
-    background-color: transparent;
-    padding: 0;
-    font-weight: normal;
-}
+/* 分享功能 */
+.tool{ display: flex; align-items: center; justify-content: space-around; width: 70vw; margin-top: 80rpx; }
+.tool-item{ text-align: center; }
+.tool-item[size="mini"]{ padding: 0; margin: 0; background-color: transparent; }
+.tool-icon{ background: #f7f8f9; width: 88rpx; height: 88rpx; border-radius: 50%; vertical-align: top; }
+.tool-text{ color: gray; font-size: 30rpx; line-height: 40rpx; margin-top: 10rpx; font-weight: normal;}
 
 /* canvas */
-.canvasImg {
-    position: absolute;
-    left: -1000%;
-    height: 800px;
-    width: 375px;
-}
+.canvas{ background: #ddd; position: absolute; top: 0; left:-200%; } 
 
-/* 何院士样式 */
-.newCode-cont {
-    width: 70%;
-    height: 200rpx;
-    position: absolute;
-    z-index: 9;
-    text-align: center;
-    left: 15%;
-    bottom: 19.5%;
-    background: linear-gradient(to top, #a09084, #a58367);
-    padding: 15rpx;
-    box-sizing: border-box;
-    border-radius: 30rpx;
-}
-
-.newCode-img {
-    height: 170rpx;
-    margin: 0 auto;
-    background: linear-gradient(to top, #e9d1bd, #c49b7a);
-    border: 4rpx solid #f3c49d;
-    border-radius: 30rpx;
-    display: flex;
-    padding: 10rpx 30rpx 10rpx 10rpx;
-    box-sizing: border-box;
-}
-
-.newCode-img-title {
-    width: calc(100% - 140rpx);
-}
-
-.newCode-img-title image {
-    width: 80%;
-    margin-top: 15rpx;
-}
-
-.newCode-img-code {
-    width: 140rpx;
-    height: 140rpx;
-}