@@ -55,7 +55,7 @@ class TianAiCaptcha {
init() {
this.destroyWindow();
this.config.domBindEl.append(template);
- this.domTemplate = this.config.domBindEl.find(".captcha-parent");
+ this.domTemplate = this.config.domBindEl.find(".__captcha-parent");
clearAllPreventDefault(this.domTemplate);
this.loadStyle();
// 绑定按钮事件
diff --git a/src/vendor/tianai-captcha/captcha/captcha.less b/src/vendor/tianai-captcha/captcha/captcha.less
index f54cd5b..fccc0d7 100644
--- a/src/vendor/tianai-captcha/captcha/captcha.less
+++ b/src/vendor/tianai-captcha/captcha/captcha.less
@@ -1,6 +1,6 @@
-.captcha-parent {
+.__captcha-parent {
box-shadow: 0 0 11px 0 #999999;
- width: 318px;
+ width: 316px;
overflow: hidden;
position: relative;
z-index: 997;
@@ -29,7 +29,7 @@
transform-style: preserve-3d;
will-change: transform;
transition-duration: 0.45s;
- transform: translateX(-300px);
+ transform: translateX(-100%);
}
}
.captcha-bg-img {
@@ -46,8 +46,12 @@
}
.slider-bottom {
+ text-align: right;
+ margin-top: 8px;
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
.close-btn, .refresh-btn {
- display: inline-block;
width: 20px;
height: 20px;
background-repeat: no-repeat;
@@ -56,18 +60,15 @@
.close-btn {
background-image: url("../images/icon.png");
background-position: 0 -14px;
- margin-right: 2px;
}
.refresh-btn {
background-image: url("../images/icon.png");
background-position: 0 -167px;
- margin-right: 10px;
}
- text-align: right;
- margin-top: 8px;
+
}
.slider-move-shadow {
- animation: myanimation 2s infinite;
+ animation: move-shadow 2s infinite;
height: 100%;
width: 5px;
background-color: #fff;
@@ -92,6 +93,14 @@
left: -1px;
border-radius: 5px;
}
+ @keyframes move-shadow {
+ from {
+ left: 0;
+ }
+ to {
+ left: 289px;
+ }
+ }
@import "./common/common.less";
@import "./slider/slider.less";
@import "./rotate/rotate.less";
diff --git a/src/vendor/tianai-captcha/captcha/common/common.less b/src/vendor/tianai-captcha/captcha/common/common.less
index 81d1095..13b36b2 100644
--- a/src/vendor/tianai-captcha/captcha/common/common.less
+++ b/src/vendor/tianai-captcha/captcha/common/common.less
@@ -1,7 +1,7 @@
.captcha {
text-align: left;
box-sizing: content-box;
- width: 300px;
+ width: 100%;
height: 260px;
z-index: 999;
.slider-bottom .logo {
@@ -21,12 +21,8 @@
z-index: 999;
font-size: 15px;
line-height: 25px;
- /*background-color: #FF5D39;*/
color: #fff;
text-align: center;
- /* transform: translateY(0px); */
- /* display: none; */
- /* transition: max-height 0.5s; */
transition: bottom 0.3s ease-in-out;
}
.captcha-tips.captcha-tips-error {
@@ -75,11 +71,3 @@
}
}
}
-@keyframes myanimation {
- from {
- left: 0;
- }
- to {
- left: 289px;
- }
-}