Browse Source

登录页面添加按钮

lizi 3 days ago
parent
commit
6ac4281830

+ 4 - 0
picture-web/src/modules/thired-ser/ogin-screen/ogin-screen.html

@@ -1,3 +1,7 @@
+<!-- 返回按钮 -->
+    <a href="#" class="back-button" id="backButton">
+        <i class="fas fa-arrow-left"></i>
+    </a>
 <!-- 装饰元素 -->
 <div class="decorations">
   <i class="decoration fas fa-utensils" style="top: 10%; left: 5%;"></i>

+ 24 - 0
picture-web/src/modules/thired-ser/ogin-screen/ogin-screen.scss

@@ -1,3 +1,27 @@
+/* 返回按钮 */
+.back-button {
+position: absolute;
+top: 25px;
+left: 25px;
+z-index: 100;
+background: rgba(255, 255, 255, 0.9);
+width: 50px;
+height: 50px;
+border-radius: 50%;
+display: flex;
+justify-content: center;
+align-items: center;
+box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
+transition: all 0.3s ease;
+color: #ff7e5f;
+font-size: 1.3rem;
+text-decoration: none;
+}        
+.back-button:hover {
+transform: translateX(-3px);
+background: white;
+box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
+}
 * {
   margin: 0;
   padding: 0;