Merge pull request OpenWebGAL#84 from MakinoharaShoko/Dev_App_Version

优雅，永不过时！
SakurajimMai · Jan 29, 2022 · 4c1605b · 4c1605b
2 parents a93421f + 858b6ee
commit 4c1605b
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 38 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "homepage": "./",
   "name": "webgal",
-  "version": "3.8.5",
+  "version": "3.8.8",
   "private": true,
   "dependencies": {
     "@icon-park/react": "^1.3.5",

diff --git a/src/Core/InteractController/UserInteract.js b/src/Core/InteractController/UserInteract.js
@@ -356,9 +356,9 @@ class userInteract {
     static hideStartPage(){
         document.getElementById("WG_startPage").style.display = 'none';
         WG_ViewControl.loadBGM();
-        if(isMobile()){
-            MobileChangeStyle();
-        }
+        // if(isMobile()){
+        //     MobileChangeStyle();
+        // }
         //设置默认动画
         WG_ViewControl.VC_setAnimationById('mainBackground','bg_softIn','2s');
         WG_ViewControl.VC_setAnimationByClass('figureContainerleft','centerIn','1s');

diff --git a/src/assets/style/animation.css b/src/assets/style/animation.css
@@ -155,8 +155,8 @@
 
 @keyframes controlButtonHoverBack {
     0% {
-        background-color: rgba(255, 255, 255, 0.25);
-        box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.65);
+        /*background-color: rgba(255, 255, 255, 0.25);*/
+        /*box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.65);*/
     }
     100% {
 
@@ -166,21 +166,21 @@
 @keyframes TitleButtonOnChoose {
     0% {
         transform: scale(1,1);
-        background-color: rgba(255,255,255,0.8);
+        /*background-color: rgba(255,255,255,0.8);*/
     }
 
     100% {
-        box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.5);
-        transform: scale(1.15,1.15) translateY(-25%);
-        background-color: rgba(255,255,255,1);
+        /*box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.5);*/
+        transform: scale(1.35,1.35) translateY(-5%);
+        /*background-color: rgba(0,0,0,0.15);*/
     }
 }
 
 @keyframes TitleButtonNoneChoose {
     0% {
-        box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.5);
-        transform: scale(1.15,1.15) translateY(-25%);
-        background-color: rgba(255,255,255,1);
+        /*box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.5);*/
+        transform: scale(1.35,1.35) translateY(-5%);
+        /*background-color: rgba(0,0,0,0.15);*/
     }
 
     100% {

diff --git a/src/assets/style/main.css b/src/assets/style/main.css
@@ -190,62 +190,63 @@
 }
 
 #TitleModel{
-    padding: 30px 0 0 0 ;
+    padding: 0 0 0 0 ;
     position: absolute;
     bottom: 0;
-    left:30%;
+    background-color: rgba(0,0,0,0.5);
+    /*left:30%;*/
     /*width: 100vw;*/
     /*height: 13%;*/
     /*background-color: rgba(255,255,255,0.3);*/
     /*background-image: linear-gradient(rgba(255,255,255,0) 0%,rgba(255,255,255,0.35) 50%,rgba(255,255,255,0.5)100%);*/
     z-index: 12;
-    width: 40%;
+    width: 100%;
 }
 
 .TitleSingleButton{
     font-family: Georgia,serif;
     /*fonts-weight: bold;*/
     padding: 10px 30px 10px 30px;
-    text-shadow: 0 0 3px rgba(255,255,255,1);
+    text-shadow: 0 0 15px rgba(0,0,0,0.6);
     margin: 3px 0 3px 0;
     /*border-top: 2px solid #8E354A;*/
-    background-color: rgba(255,255,255,0.8);
-    color: #8E354A;
+    color: white;
     /*width: 15%;*/
     text-align: center;
     animation: TitleButtonNoneChoose 0.75s;
     /*border: 1px solid rgba(0,0,0,0.2);*/
     /*border-radius: 7px;*/
     /*box-shadow: 2px 2px 7px rgba(0,0,0,0.3);*/
     cursor: pointer;
-    border-right: 4px solid #8E354A;
-    border-left: 4px solid #8E354A;
-    box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.2);
-}
-
-#leftTitleButton{
-    border-top: none;
+    letter-spacing: 3px;
+    /*border-right: 4px solid #8E354A;*/
+    /*border-left: 4px solid #8E354A;*/
+    /*box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.1);*/
+    /*background-image: linear-gradient(to right,rgba(0,0,0,0) 0% ,rgba(0,0,0,0) 25% ,rgba(0,0,0,0.12) 40%,rgba(0,0,0,0.12) 60%,rgba(0,0,0,0) 75% ,rgba(0,0,0,0) 100%);*/
 }
 
 .TitleSingleButton:hover{
     /*background-color: rgba(255,255,255,0.2);*/
-    box-shadow: 3px 3px 15px rgba(0,0,0,0.5);
     animation: TitleButtonOnChoose 0.75s;
-    transform: scale(1.15,1.15) translateY(-25%);
-    background-color: rgba(255,255,255,1);
+    transform: scale(1.35,1.35) translateY(-5%);
 }
 
+#leftTitleButton{
+    border-top: none;
+}
+
+
+
 #setButtonBottom{
     position: relative;
     display: flex;
-    justify-content: center;
-    justify-items: center;
-    justify-self: center;
+    justify-content: space-around;
     text-align: center;
     /*top: 15px;*/
     width: 100%;
     font-size: 200%;
-    flex-flow: column;
+
+    /*flex-flow: column;*/
     /*background: linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 15%,rgba(255,255,255,0.3) 35%,rgba(255,255,255,0.3) 65%,rgba(255,255,255,0.1) 85%,rgba(255,255,255,0) 100%);*/
 }
 

diff --git a/src/index.js b/src/index.js
@@ -23,13 +23,14 @@ import './assets/style/panic.css';
 import './assets/style/settings.css';
 import './assets/style/window.css'
 import './assets/style/UI_component.css';
+import {isMobile, MobileChangeStyle} from "./Core/util/WG_util";
 
 
 ReactDOM.render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.getElementById('ReactRoot')
+    <React.StrictMode>
+        <App/>
+    </React.StrictMode>,
+    document.getElementById('ReactRoot')
 );
 
 // If you want to start measuring performance in your app, pass a function
@@ -39,4 +40,7 @@ reportWebVitals();
 
 loadCookie();
 loadSettings();
-getGameInfo();
+getGameInfo();
+
+if (isMobile())
+    MobileChangeStyle();