From db0d3b92ae7334ffc8560314a0958f953ddd9cac Mon Sep 17 00:00:00 2001 From: imsyy Date: Thu, 6 Apr 2023 16:16:11 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E8=B0=83=E6=95=B4=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/style/global.css | 32 ------ src/style/global.css.map | 1 - src/style/style.css | 179 ------------------------------- src/style/style.css.map | 1 - src/style/style.scss | 220 +++++++++++++++++++-------------------- src/views/Main/Right.vue | 6 +- 6 files changed, 112 insertions(+), 327 deletions(-) delete mode 100644 src/style/global.css delete mode 100644 src/style/global.css.map delete mode 100644 src/style/style.css delete mode 100644 src/style/style.css.map diff --git a/src/style/global.css b/src/style/global.css deleted file mode 100644 index 0d7a3d5..0000000 --- a/src/style/global.css +++ /dev/null @@ -1,32 +0,0 @@ -@charset "UTF-8"; -.container { - max-width: 1200px; -} - -/* 小于1200px时 */ -@media (max-width: 1380px) { - .el-radio-group { - justify-content: center !important; - } -} -/* 小于1200px时 */ -@media (max-width: 1200px) { - .container { - max-width: 1000px; - } - .sm-hidden { - display: none; - } -} -/* 小于992px时 */ -@media (max-width: 992px) { - .container { - max-width: 900px; - } -} -/* 小于720px时 */ -@media (max-width: 720px) { - .xs-hidden { - display: none; - } -}/*# sourceMappingURL=global.css.map */ \ No newline at end of file diff --git a/src/style/global.css.map b/src/style/global.css.map deleted file mode 100644 index de0f57a..0000000 --- a/src/style/global.css.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"sources":["global.css","global.scss"],"names":[],"mappings":"AAAA,gBAAgB;ACIZ;EACI,iBAFqB;ADA7B;;ACSA,cAAA;AACA;EACI;IACI,kCAAA;EDNN;AACF;ACSA,cAAA;AACA;EAhBI;IACI,iBAgB2B;EDNjC;ECSE;IACI,aAAA;EDPN;AACF;ACUA,aAAA;AACA;EA1BI;IACI,gBA0B2B;EDPjC;AACF;ACSA,aAAA;AACA;EAGI;IACI,aAAA;EDTN;AACF","file":"global.css"} \ No newline at end of file diff --git a/src/style/style.css b/src/style/style.css deleted file mode 100644 index 3c7aee2..0000000 --- a/src/style/style.css +++ /dev/null @@ -1,179 +0,0 @@ -@charset "UTF-8"; -/* -作者: imsyy -主页:https://www.imsyy.top/ -GitHub:https://github.com/imsyy/home -版权所有,请勿删除 -*/ -/*全局样式*/ -html, -body { - width: 100%; - height: 100%; - background-color: #333; - overflow: hidden; -} - -*, -a, -p { - margin: 0; - padding: 0; - -webkit-user-select: none; - -webkit-user-drag: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - text-decoration: none; - transition: 0.3s; - color: #fff; - box-sizing: border-box; -} -*:hover, -a:hover, -p:hover { - transition: 0.3s; -} - -@font-face { - font-family: "Pacifico-Regular"; - src: url("/font/Pacifico-Regular.ttf") format("truetype"); -} -@font-face { - font-family: "UnidreamLED"; - src: url("/font/UnidreamLED.ttf") format("truetype"); -} -#app { - position: absolute; - top: 0; - left: 0; - width: 100vw; - height: 100vh; - z-index: 0; -} - -.cards { - border-radius: 6px; - background: rgba(0, 0, 0, 0.2509803922); - -webkit-backdrop-filter: blur(10px); - backdrop-filter: blur(10px); - transform: scale(1); - transition: 0.5s; - animation: fade; - -webkit-animation: fade 0.5s; -} - -.cards:hover { - transform: scale(1.01); - transition: 0.5s; -} - -.cards:active { - transform: scale(0.98); - transition: 0.5s; -} - -.el-message { - --el-message-bg-color: #00000040 !important; - --el-message-text-color: #efefef !important; - -webkit-backdrop-filter: blur(10px); - backdrop-filter: blur(10px); - border-radius: 25px !important; - border-color: transparent !important; -} -.el-message .el-message__badge { - display: none; -} - -.el-progress-bar .el-progress-bar__outer { - border-radius: 6px; - background-color: rgba(0, 0, 0, 0.1254901961); -} -.el-progress-bar .el-progress-bar__outer .el-progress-bar__inner { - background-color: #efefef; - border-radius: 6px; - text-align: center; - font-family: "UnidreamLED"; -} -.el-progress-bar .el-progress-bar__outer .el-progress-bar__inner span { - color: #564d59; - font-size: 0.9rem; -} - -.el-popper.is-dark { - background: rgba(255, 255, 255, 0.3764705882) !important; - border: 1px solid transparent !important; -} - -.el-card { - border-radius: 8px !important; - border: 1px solid transparent !important; - background-color: transparent !important; -} -.el-card .el-card__header { - font-weight: bold; - padding: 16px 20px !important; - background-color: rgba(255, 255, 255, 0.1882352941) !important; - border-bottom: 1px solid transparent !important; -} -.el-card .el-card__body { - padding: 0 !important; - background-color: rgba(255, 255, 255, 0.062745098) !important; -} - -.fade-enter-active { - -webkit-animation: fade 0.3s ease-in-out; - animation: fade 0.3s ease-in-out; -} - -.fade-leave-active { - animation: fade 0.3s ease-in-out reverse; -} - -@-webkit-keyframes fade { - 0% { - opacity: 0; - } - 100% { - opacity: 1; - } -} - -@keyframes fade { - 0% { - opacity: 0; - } - 100% { - opacity: 1; - } -} -#cursor { - position: fixed; - width: 18px; - height: 18px; - background: #fff; - border-radius: 25px; - opacity: 0.25; - z-index: 10086; - pointer-events: none; - transition: 0.2s ease-in-out; - transition-property: background, opacity, transform; -} -#cursor.hidden { - opacity: 0; -} -#cursor.active { - opacity: 0.5; - transform: scale(0.5); -} - -::-webkit-scrollbar { - width: 6px; - height: 6px; - background-color: transparent; -} - -::-webkit-scrollbar-thumb { - border-radius: 10px; - background-color: #eeeeee; -}/*# sourceMappingURL=style.css.map */ \ No newline at end of file diff --git a/src/style/style.css.map b/src/style/style.css.map deleted file mode 100644 index f354fb7..0000000 --- a/src/style/style.css.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"sources":["style.css","style.scss"],"names":[],"mappings":"AAAA,gBAAgB;ACAhB;;;;;CAAA;AASA,OAAA;AAEA;;EAEI,WAAA;EACA,YAAA;EACA,sBAAA;EACA,gBAAA;ADFJ;;ACKA;;;EAGI,SAAA;EACA,UAAA;EACA,yBAAA;EACA,uBAAA;EACA,sBAAA;GAAA,qBAAA;OAAA,iBAAA;EACA,qBAAA;EACA,gBAAA;EACA,WAAA;EACA,sBAAA;ADFJ;ACII;;;EACI,gBAAA;ADAR;;ACOA;EACI,+BAAA;EACA,yDAAA;ADJJ;ACOA;EACI,0BAAA;EACA,oDAAA;ADLJ;ACUA;EACI,kBAAA;EACA,MAAA;EACA,OAAA;EACA,YAAA;EACA,aAAA;EACA,UAAA;ADRJ;;ACYA;EACI,kBAAA;EACA,uCAAA;EACA,mCAAA;EACA,2BAAA;EACA,mBAAA;EACA,gBAAA;EACA,eAAA;EACA,4BAAA;ADTJ;;ACYA;EACI,sBAAA;EACA,gBAAA;ADTJ;;ACYA;EACI,sBAAA;EACA,gBAAA;ADTJ;;ACaA;EACI,2CAAA;EACA,2CAAA;EACA,mCAAA;EACA,2BAAA;EACA,8BAAA;EACA,oCAAA;ADVJ;ACYI;EACI,aAAA;ADVR;;ACgBI;EACI,kBAAA;EACA,6CAAA;ADbR;ACeQ;EACI,yBAAA;EACA,kBAAA;EACA,kBAAA;EACA,0BAAA;ADbZ;ACeY;EACI,cAAA;EACA,iBAAA;ADbhB;;ACsBA;EACI,wDAAA;EACA,wCAAA;ADnBJ;;ACuBA;EACI,6BAAA;EACA,wCAAA;EACA,wCAAA;ADpBJ;ACsBI;EACI,iBAAA;EACA,6BAAA;EACA,8DAAA;EACA,+CAAA;ADpBR;ACuBI;EACI,qBAAA;EACA,6DAAA;ADrBR;;AC0BA;EACI,wCAAA;UAAA,gCAAA;ADvBJ;;AC0BA;EACI,wCAAA;ADvBJ;;AC0BA;EACI;IACI,UAAA;EDvBN;EC0BE;IACI,UAAA;EDxBN;AACF;;ACiBA;EACI;IACI,UAAA;EDvBN;EC0BE;IACI,UAAA;EDxBN;AACF;AC4BA;EACI,eAAA;EACA,WAAA;EACA,YAAA;EACA,gBAAA;EACA,mBAAA;EACA,aAAA;EACA,cAAA;EACA,oBAAA;EACA,4BAAA;EACA,mDAAA;AD1BJ;AC4BI;EACI,UAAA;AD1BR;AC6BI;EACI,YAAA;EACA,qBAAA;AD3BR;;ACiCA;EACI,UAAA;EACA,WAAA;EACA,6BAAA;AD9BJ;;ACiCA;EACI,mBAAA;EACA,yBAAA;AD9BJ","file":"style.css"} \ No newline at end of file diff --git a/src/style/style.scss b/src/style/style.scss index c6744a7..646f232 100644 --- a/src/style/style.scss +++ b/src/style/style.scss @@ -11,191 +11,189 @@ GitHub:https://github.com/imsyy/home html, body { - width: 100%; - height: 100%; - background-color: #333; - overflow: hidden; - font-family: 'HarmonyOS_Regular', sans-serif; + width: 100%; + height: 100%; + background-color: #333; + overflow: hidden; + font-family: "HarmonyOS_Regular", sans-serif; } *, a, p { - margin: 0; - padding: 0; - -webkit-user-select: none; - -webkit-user-drag: none; - user-select: none; - text-decoration: none; - color: #fff; - box-sizing: border-box; + margin: 0; + padding: 0; + -webkit-user-select: none; + -webkit-user-drag: none; + user-select: none; + text-decoration: none; + color: #fff; + box-sizing: border-box; - &:hover { - transition: .3s; - } + &:hover { + transition: 0.3s; + } } - // 字体文件 @font-face { - font-family: "Pacifico-Regular"; - src: url('/font/Pacifico-Regular.ttf') format('truetype'); + font-family: "Pacifico-Regular"; + src: url("/font/Pacifico-Regular.ttf") format("truetype"); } @font-face { - font-family: "UnidreamLED"; - src: url('/font/UnidreamLED.ttf') format('truetype'); + font-family: "UnidreamLED"; + src: url("/font/UnidreamLED.ttf") format("truetype"); } - // 基础样式 #app { - position: fixed; - top: 0; - left: 0; - width: 100vw; - height: 100vh; - z-index: 0; + position: fixed; + top: 0; + left: 0; + width: 100vw; + height: 100vh; + z-index: 0; } // 卡片样式 .cards { - border-radius: 6px; - background: #00000040; - -webkit-backdrop-filter: blur(10px); - backdrop-filter: blur(10px); - transform: scale(1); - transition: all 0.3s; + border-radius: 6px; + background: #00000040; + -webkit-backdrop-filter: blur(10px); + backdrop-filter: blur(10px); + transform: scale(1); + transition: all 0.3s; } .cards:hover { - transform: scale(1.01); + transform: scale(1.01); } .cards:active { - transform: scale(0.98); + transform: scale(0.98); } // 文字超出 .text-hidden { - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; } // 弹窗样式 .el-message { - --el-message-bg-color: #00000040 !important; - --el-message-text-color: #efefef !important; - -webkit-backdrop-filter: blur(10px); - backdrop-filter: blur(10px); - border-radius: 25px !important; - border-color: transparent !important; + --el-message-bg-color: #00000040 !important; + --el-message-text-color: #efefef !important; + -webkit-backdrop-filter: blur(10px); + backdrop-filter: blur(10px); + border-radius: 25px !important; + border-color: transparent !important; - .el-message__badge { - display: none; - } + .el-message__badge { + display: none; + } + .el-message__content { + white-space: nowrap; + } } // 进度条样式 .el-progress-bar { - .el-progress-bar__outer { - border-radius: 6px; - background-color: #00000020; + .el-progress-bar__outer { + border-radius: 6px; + background-color: #00000020; - .el-progress-bar__inner { - background-color: #efefef; - border-radius: 6px; - text-align: center; - font-family: 'UnidreamLED'; + .el-progress-bar__inner { + background-color: #efefef; + border-radius: 6px; + text-align: center; + font-family: "UnidreamLED"; - span { - color: #564d59; - font-size: .9rem; - } - - } + span { + color: #564d59; + font-size: 0.9rem; + } } - + } } // Tooltip 样式 .el-popper.is-dark { - background: #ffffff60 !important; - border: 1px solid transparent !important; + background: #ffffff60 !important; + border: 1px solid transparent !important; } // 卡片样式 .el-card { - border-radius: 8px !important; - border: 1px solid transparent !important; - background-color: transparent !important; + border-radius: 8px !important; + border: 1px solid transparent !important; + background-color: transparent !important; - .el-card__header { - font-weight: bold; - padding: 16px 20px !important; - background-color: #ffffff30 !important; - border-bottom: 1px solid transparent !important; - } + .el-card__header { + font-weight: bold; + padding: 16px 20px !important; + background-color: #ffffff30 !important; + border-bottom: 1px solid transparent !important; + } - .el-card__body { - padding: 0 !important; - background-color: #ffffff10 !important; - } + .el-card__body { + padding: 0 !important; + background-color: #ffffff10 !important; + } } // 渐入动画 @keyframes fade { - 0% { - opacity: 0; - } + 0% { + opacity: 0; + } - 100% { - opacity: 1; - } + 100% { + opacity: 1; + } } // 隐藏元素 @media (min-width: 910px) and (max-width: 1200px) { - .sm-hidden { - display: none; - } + .sm-hidden { + display: none; + } } - // 自定义鼠标 #cursor { - position: fixed; - width: 18px; - height: 18px; - background: #fff; - border-radius: 25px; - opacity: 0.25; - z-index: 10086; - pointer-events: none; - transition: 0.2s ease-in-out; - transition-property: background, opacity, transform; + position: fixed; + width: 18px; + height: 18px; + background: #fff; + border-radius: 25px; + opacity: 0.25; + z-index: 10086; + pointer-events: none; + transition: 0.2s ease-in-out; + transition-property: background, opacity, transform; - &.hidden { - opacity: 0; - } + &.hidden { + opacity: 0; + } - &.active { - opacity: 0.5; - transform: scale(0.5); - } + &.active { + opacity: 0.5; + transform: scale(0.5); + } } // 滚动条样式 ::-webkit-scrollbar, scrollbar { - width: 6px; - height: 6px; - background-color: transparent; + width: 6px; + height: 6px; + background-color: transparent; } ::-webkit-scrollbar-thumb, scrollbar-thumb { - border-radius: 10px; - background-color: #eeeeee; -} \ No newline at end of file + border-radius: 10px; + background-color: #eeeeee; +} diff --git a/src/views/Main/Right.vue b/src/views/Main/Right.vue index da11622..347d6b4 100644 --- a/src/views/Main/Right.vue +++ b/src/views/Main/Right.vue @@ -30,13 +30,13 @@ let siteUrl = import.meta.env.VITE_SITE_URL.split("."); width: 50%; margin-left: 0.75rem; .logo { - width: 80%; + width: 100%; font-family: "Pacifico-Regular"; font-size: 1.75rem; position: fixed; top: 6%; - left: 50%; - transform: translateX(-50%); + left: 0; + text-align: center; transition: all 0.3s; animation: fade; -webkit-animation: fade 0.5s;