|
@@ -2352,23 +2352,86 @@ animation:shake 1s .2s ease both;}
|
|
|
}
|
|
}
|
|
|
/* ai按钮css */
|
|
/* ai按钮css */
|
|
|
.ai-fill-btn {
|
|
.ai-fill-btn {
|
|
|
- background: linear-gradient(90deg, #FF9A56 0%, #FF6B9D 50%, #C86DD7 100%);
|
|
|
|
|
|
|
+ position: relative;
|
|
|
|
|
+ border: 1px solid rgba(255,255,255,0.15);
|
|
|
color: #fff;
|
|
color: #fff;
|
|
|
- border: none;
|
|
|
|
|
- box-shadow: 0 2px 8px rgba(255, 107, 157, 0.4);
|
|
|
|
|
- transition: all 0.2s ease;
|
|
|
|
|
- padding: 2px 7px;
|
|
|
|
|
|
|
+ cursor: pointer;
|
|
|
|
|
+ overflow: hidden;
|
|
|
|
|
+
|
|
|
|
|
+ /* AI动态渐变背景 */
|
|
|
|
|
+ background: linear-gradient(
|
|
|
|
|
+ 270deg,
|
|
|
|
|
+ #a855f7,
|
|
|
|
|
+ #ec4899,
|
|
|
|
|
+ #f59e0b,
|
|
|
|
|
+ #a855f7
|
|
|
|
|
+ );
|
|
|
|
|
+ background-size: 400% 400%;
|
|
|
|
|
+
|
|
|
|
|
+ animation: aiGradient 6s ease infinite;
|
|
|
|
|
+
|
|
|
|
|
+ /* 发光 */
|
|
|
|
|
+ box-shadow:
|
|
|
|
|
+ 0 0 6px rgba(0, 245, 255, 0.5),
|
|
|
|
|
+ 0 0 12px rgba(139, 92, 246, 0.35);
|
|
|
|
|
+
|
|
|
|
|
+ transition: all 0.3s ease;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+/*.ai-fill-btn:hover {*/
|
|
|
|
|
+/* color: #fff;*/
|
|
|
|
|
+/* transform: translateY(-1px);*/
|
|
|
|
|
+/* box-shadow: 0 4px 12px rgba(255, 107, 157, 0.55);*/
|
|
|
|
|
+/*}*/
|
|
|
|
|
+
|
|
|
|
|
+/* 流光 */
|
|
|
|
|
+.ai-fill-btn::before {
|
|
|
|
|
+ content: '';
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ top: 0;
|
|
|
|
|
+ left: -120%;
|
|
|
|
|
+ width: 80%;
|
|
|
|
|
+ height: 100%;
|
|
|
|
|
+ background: linear-gradient(
|
|
|
|
|
+ 120deg,
|
|
|
|
|
+ transparent,
|
|
|
|
|
+ rgba(255,255,255,0.35),
|
|
|
|
|
+ transparent
|
|
|
|
|
+ );
|
|
|
|
|
+ transform: skewX(-25deg);
|
|
|
|
|
+ animation: shine 3s infinite;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.ai-fill-btn:hover {
|
|
.ai-fill-btn:hover {
|
|
|
- color: #fff;
|
|
|
|
|
- transform: translateY(-1px);
|
|
|
|
|
- box-shadow: 0 4px 12px rgba(255, 107, 157, 0.55);
|
|
|
|
|
|
|
+ transform: translateY(-2px);
|
|
|
|
|
+ box-shadow:
|
|
|
|
|
+ 0 0 8px rgba(0, 245, 255, 0.8),
|
|
|
|
|
+ 0 0 14px rgba(139, 92, 246, 0.6);
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+@keyframes aiGradient {
|
|
|
|
|
+ 0% {
|
|
|
|
|
+ background-position: 0% 50%;
|
|
|
|
|
+ }
|
|
|
|
|
+ 50% {
|
|
|
|
|
+ background-position: 100% 50%;
|
|
|
|
|
+ }
|
|
|
|
|
+ 100% {
|
|
|
|
|
+ background-position: 0% 50%;
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-.ai-fill-btn i {
|
|
|
|
|
- margin-right: 4px;
|
|
|
|
|
|
|
+@keyframes shine {
|
|
|
|
|
+ 0% {
|
|
|
|
|
+ left: -120%;
|
|
|
|
|
+ }
|
|
|
|
|
+ 100% {
|
|
|
|
|
+ left: 150%;
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
|
|
+/*.ai-fill-btn i {*/
|
|
|
|
|
+/* margin-right: 4px;*/
|
|
|
|
|
+/*}*/
|
|
|
|
|
|
|
|
.ai-upload-area {
|
|
.ai-upload-area {
|
|
|
border: 2px dashed #d9d9d9;
|
|
border: 2px dashed #d9d9d9;
|
|
@@ -2377,11 +2440,13 @@ animation:shake 1s .2s ease both;}
|
|
|
text-align: center;
|
|
text-align: center;
|
|
|
cursor: pointer;
|
|
cursor: pointer;
|
|
|
transition: border-color 0.2s;
|
|
transition: border-color 0.2s;
|
|
|
|
|
+ border-color: #007bff;
|
|
|
|
|
+ color: #007bff;
|
|
|
}
|
|
}
|
|
|
.ai-upload-area:hover,
|
|
.ai-upload-area:hover,
|
|
|
.ai-upload-area.dragover {
|
|
.ai-upload-area.dragover {
|
|
|
- border-color: #C86DD7;
|
|
|
|
|
- background: #fdf6ff;
|
|
|
|
|
|
|
+ border-color: #0069d9;
|
|
|
|
|
+ background: #f3f8ff;
|
|
|
}
|
|
}
|
|
|
.ai-upload-result {
|
|
.ai-upload-result {
|
|
|
display: flex;
|
|
display: flex;
|