Initial commit: queue workspace

Made-with: Cursor

pro_v3.5.1/public/install/css/step1.css

@@ -0,0 +1,180 @@
+.wrap {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    position: relative;
+    /* 背景渐变色 */
+    text-align: center;
+    text-decoration: none;
+    text-transform: uppercase;
+    background-image: linear-gradient(to right, #134392, #132FBB, #5F38C1, #134392);
+    /* 背景渐变色大小 */
+    background-size: 300%;
+    box-shadow: none;
+    animation: light 10s infinite;
+    animation-direction: alternate;
+}
+
+/* 下面设计 发光效果 */
+.wrap::before {
+    content: '';
+    position: absolute;
+    top: -6px;
+    bottom: -6px;
+    left: -6px;
+    right: -6px;
+    border-radius: 60px;
+    /* 背景渐变色 */
+    background-image: linear-gradient(to right, rgba(48,114,229,0.15), rgba(48,114,229,0.15));
+    /* 背景渐变色大小 */
+    background-size: 300%;
+    /* 元素的位置 底层或者顶层  -值表示底层 + 值表示顶层 */
+    z-index: -1;
+    /* 设置模糊度 显示发光效果 */
+    filter: blur(20px);
+}
+
+@keyframes light {
+    100% {
+        background-position: -100% 0;
+    }
+}
+
+.section {
+    height: 100%;
+    z-index: 11;
+    text-align: left;
+    position: absolute;
+    background: rgba(34, 34, 34, 0.6);
+    border-radius: 36px 36px 36px 36px;
+    backdrop-filter: blur(20px);
+    -webkit-backdrop-filter: blur(20px);
+}
+
+.logo {
+    width: 186px;
+    height: 70px;
+    margin-bottom: 20px;
+    transition: all 0.3s;
+    cursor: pointer;
+}
+
+.logo:hover {
+    transform: scale(1.1);
+}
+
+.bottom {
+    color: #5A487D;
+    width: 110px;
+    height: 32px;
+    background: #FFFFFF;
+    border-radius: 137px 137px 137px 137px;
+    font-size: 14px;
+    line-height: 32px;
+    margin: 0 auto;
+    margin-top: 20px;
+    cursor: pointer;
+    text-align: center;
+    /*font-size: 400px;*/
+    transition: all 0.3s;
+}
+
+.bottom:hover {
+    box-shadow: 0 2px 25px rgba(0, 234, 250, 0.5);
+}
+
+.bottom .btn {
+    display: block;
+    width: 100%;
+    height: 100%;
+    font-weight: 600;
+}
+
+.more-text {
+    background: linear-gradient(to right, #134392 0%, #363A8A 100%);
+    -webkit-background-clip: text;
+    color: transparent;
+}
+
+.agreement {
+    height: 21px;
+    margin: 6px 0 10px 0;
+}
+
+.agreements {
+    color: #A8CDE7;
+}
+
+.solgen {
+    position: absolute;
+    width: 364px;
+    height: 16px;
+    bottom: 45px;
+    left: 218px;
+}
+
+.radio-box {
+    border: 1px solid #fff;
+    border-radius: 50%;
+    width: 14px;
+    height: 14px;
+    position: relative;
+    margin-right: 10px;
+    font-size: 14px;
+}
+
+.is-shock {
+    animation: shock 0.5s infinite;
+}
+
+.agreement span {
+    line-height: 14px;
+}
+
+.radio-box img {
+    position: absolute;
+    left: -1px;
+    top: -1px;
+    width: 16px;
+    height: 16px;
+    animation: show 0.3s;
+}
+
+@keyframes show {
+    0% {
+        transform: scale(0);
+        -moz-transform: scale(0);
+        -webkit-transform: scale(0);
+    }
+
+    100% {
+        transform: scale(1);
+        -moz-transform: scale(1);
+        -webkit-transform: scale(1);
+    }
+}
+
+@keyframes shock {
+    0% {
+        margin-top: 0px;
+    }
+    20% {
+        margin-bottom: 10px;
+    }
+    40% {
+        margin-bottom: 0px;
+    }
+    60% {
+        margin-bottom: 8px;
+    }
+    70% {
+        margin-bottom: 0px;
+    }
+    90% {
+        margin-bottom: 4px;
+    }
+    100% {
+        margin-bottom: 0px;
+
+    }
+}