From d354022fc258f376fbbded621af190b30d7bcdf1 Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期一, 13 一月 2025 09:24:05 +0800
Subject: [PATCH] 修改首页
---
src/views/login.vue | 47 +++++++++++++++++++++++++++++++++--------------
1 files changed, 33 insertions(+), 14 deletions(-)
diff --git a/src/views/login.vue b/src/views/login.vue
index c9f0f31..5a467a1 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -1,7 +1,13 @@
<template>
<el-row class="login">
<el-col :sm="24" :md="12" class="login-name">
- 新疆维吾尔自治区特种作业<br/>安全生产知识和管理能力考核平台
+ <div class="bigName">
+ <span>新疆维吾尔自治区</span>
+ <br/>安全生产知识和管理能力考核平台
+ </div>
+ <div class="smallName">
+ 数据存档 / 远程监巡考 / 特种作业缴费 / 网络培训监管
+ </div>
</el-col>
<el-col :sm="24" :md="12" class="login-box">
<div class="login-card">
@@ -169,6 +175,7 @@
</script>
<style rel="stylesheet/scss" lang="scss">
+
@font-face {
font-family: "AliMa";
src: url("../assets/styles/AlimamaShuHeiTi-Bold.ttf");
@@ -198,18 +205,29 @@
.login-name{
display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
opacity: 0;
-webkit-opacity: 0;
animation: floatDown ease 0.6s forwards;
- justify-content: center;
- align-items: center;
- font-family: 'AliMa';
- color: #fff;
- font-size: 3rem;
text-align: center;
- line-height: 1.6;
+ line-height: 1.5;
transform: translateY(-120px);
- text-shadow: -10px 10px 20px rgba(0,0,0,.4);
+ .bigName{
+ font-family: 'AliMa';
+ color: #fff;
+ font-size: clamp(2.25rem, 0.401rem + 2.17vw, 3rem);
+ text-shadow: -10px 10px 20px rgba(0,0,0,.4);
+ span{
+ font-size: clamp(3rem, 0.534rem + 2.89vw, 4rem);
+ }
+ }
+ .smallName{
+ margin-top: 20px;
+ font-size: clamp(1.125rem, 0.2rem + 1.08vw, 1.5rem);
+ color: #fff;
+ }
}
@keyframes floatUp {
@@ -224,20 +242,21 @@
display: flex;
justify-content: center;
align-items: center;
- opacity: 0;
- -webkit-opacity: 0;
- animation: floatUp ease 0.6s forwards;
+
.login-card{
width: 500px;
padding: 30px;
border-radius: 16px;
- background-color: rgba(40,40,40,.5);
- backdrop-filter: blur(8px);
- -webkit-backdrop-filter: blur(8px);
+ background-color: rgba(40,40,40,.4);
+ backdrop-filter: blur(6px);
+ -webkit-backdrop-filter: blur(6px);
border: 1px solid rgba(255,255,255,.6);
max-width: 100%;
box-sizing: border-box;
box-shadow: 0 10px 20px rgba(0,0,0,.05);
+ opacity: 0;
+ -webkit-opacity: 0;
+ animation: floatUp ease 0.6s forwards;
}
.login-form {
width: 100%;
--
Gitblit v1.9.2