Browse Source

no message

zhejiushizhuce 2 years ago
parent
commit
a5c4353a0e

+ 7 - 7
src/components/AutoWinList/index.jsx

@@ -222,8 +222,8 @@ const AutoWinList=({data})=>{
     },[currIndex]);
     const formatGolds=(golds)=>{
         golds=Number(golds);
-        let str=(golds/1000).toFixed(2);
-        return "$"+str+"K";
+        let str=golds<1000?golds.toFixed(2):(golds/1000).toFixed(2)+"K";
+        return "$"+str;
     }
     const renderHAuto=()=>{
         let hlist=getAutoList();
@@ -270,7 +270,7 @@ const AutoWinList=({data})=>{
                     className={styles.swiper_container_m}
                     onSwiper={setSwiper}
                     direction={"vertical"}
-                    slidesPerView={3}
+                    slidesPerView={1}
                     loop
                     autoplay={{delay: 1000, disableOnInteraction: false}}
                     effect="fade"
@@ -301,9 +301,9 @@ const AutoWinList=({data})=>{
                                                 </div>
                                                 <img className={styles.coin_m} src={usdimg}/>
                                             </div>
-                                            <svg className={styles.icon_arrow}>
-                                                <use xlinkHref={`${symbol}#icon_Arrow`} />
-                                            </svg>
+                                            {/*<svg className={styles.icon_arrow}>*/}
+                                            {/*    <use xlinkHref={`${symbol}#icon_Arrow`} />*/}
+                                            {/*</svg>*/}
                                         </div>
                                     </div>
                                 </SwiperSlide>
@@ -339,7 +339,7 @@ const AutoWinList=({data})=>{
         return view;
     }
     return (
-        <div className={`w-100 ${styles.win_list_container}`}>
+        <div className={`w-100 ${isMobile()?styles.win_list_container_m:styles.win_list_container}`}>
             {renderTitle()}
             {renderContext()}
         </div>

+ 167 - 154
src/components/AutoWinList/styles.module.scss

@@ -7,185 +7,198 @@
   }
 }
 .win_list_container{
-  & .list_title{
+}
+.win_list_container_m{
+  display: flex;
+  flex-direction: row;
+  gap: 1rem;
+  justify-content: space-between;
+  align-items: center;
+}
+.list_title{
+  font-size: .875rem;
+  line-height: 22px;
+  color: var(--header);
+  position: relative;
+  display: flex;
+  -webkit-box-align: center;
+  align-items: center;
+  margin: 0 0 8px 8px;
+  @media screen and (max-width: 621px) {
     font-size: .875rem;
-    line-height: 22px;
-    color: var(--header);
+    white-space: nowrap;
+  }
+  b{
+    background-color: #45d91e;
+    width: .5rem;
+    height: .5rem;
+    border-radius: .25rem;
     position: relative;
+    margin-right: .625rem;
+    &:after{
+      content: "";
+      position: absolute;
+      display: block;
+      width: 100%;
+      height: 100%;
+      border-radius: 50%;
+      left: 50%;
+      top: 50%;
+      margin-top: -.25rem;
+      margin-left: -.25rem;
+      background-color: #45d91e4d;
+      animation: online-ani infinite 1.5s linear;
+    }
+  }
+}
+.list_context{
+  background: var(--widget-grid-bg);
+  padding: 8px 6px;
+  border-radius: var(--border-radius);
+  & .tabs{
     display: flex;
-    -webkit-box-align: center;
-    align-items: center;
-    margin: 0 0 8px 8px;
-    b{
-      background-color: #45d91e;
-      width: .5rem;
-      height: .5rem;
-      border-radius: .25rem;
-      position: relative;
-      margin-right: .625rem;
-      &:after{
-        content: "";
-        position: absolute;
-        display: block;
-        width: 100%;
-        height: 100%;
-        border-radius: 50%;
-        left: 50%;
-        top: 50%;
-        margin-top: -.25rem;
-        margin-left: -.25rem;
-        background-color: #45d91e4d;
-        animation: online-ani infinite 1.5s linear;
+    padding: 0 6px;
+    margin-bottom: 8px;
+    & .tab_btn{
+      padding: .3125rem .375rem;
+      line-height: 14px;
+      border-radius: var(--border-radius);
+      cursor: pointer;
+      width: auto;
+      height: auto;
+      margin-right: 2px;
+      color: var(--text);
+      &.active{
+        background-color:var(--nav-item-hover);
+        font-weight: 600;
+        color: var(--header);
       }
     }
   }
-  & .list_context{
-    background: var(--widget-grid-bg);
-    padding: 8px 6px;
-    border-radius: var(--border-radius);
-    & .tabs{
-      display: flex;
+  & .swiper_stop{
+    scroll-snap-type:none !important;
+    scroll-behavior:auto !important;
+  }
+  & .swiper_container{
+    width: 100%;
+    display: flex;
+    overflow-x: auto;
+    scroll-snap-type: x mandatory;
+    scroll-behavior: smooth;
+    & .swiper_item{
       padding: 0 6px;
-      margin-bottom: 8px;
-      & .tab_btn{
-        padding: .3125rem .375rem;
-        line-height: 14px;
-        border-radius: var(--border-radius);
-        cursor: pointer;
-        width: auto;
+      flex: none;
+      width: 96px;
+      scroll-snap-align: start;
+      & .game_icon{
         height: auto;
-        margin-right: 2px;
-        color: var(--text);
-        &.active{
-          background-color:var(--nav-item-hover);
-          font-weight: 600;
-          color: var(--header);
+        img {
+          border-radius: var(--border-radius);
         }
       }
-    }
-    & .swiper_stop{
-      scroll-snap-type:none !important;
-      scroll-behavior:auto !important;
-    }
-    & .swiper_container{
-      width: 100%;
-      display: flex;
-      overflow-x: auto;
-      scroll-snap-type: x mandatory;
-      scroll-behavior: smooth;
-      & .swiper_item{
-        padding: 0 6px;
-        flex: none;
-        width: 96px;
-        scroll-snap-align: start;
-        & .game_icon{
-          height: auto;
-          img {
-            border-radius: var(--border-radius);
-          }
-        }
-        & .amount_wrap{
-          color: var(--primary-color);
-          font-weight: 600;
-          font-size: 13px;
-          text-align: center;
+      & .amount_wrap{
+        color: var(--primary-color);
+        font-weight: 600;
+        font-size: 13px;
+        text-align: center;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+      & .nick_name{
+        font-size: 12px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        margin-top: 6px;
+        color: var(--header);
+        & .name_txt{
           white-space: nowrap;
           overflow: hidden;
           text-overflow: ellipsis;
         }
-        & .nick_name{
-          font-size: 12px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          margin-top: 6px;
-          color: var(--header);
-          & .name_txt{
-            white-space: nowrap;
-            overflow: hidden;
-            text-overflow: ellipsis;
-          }
-          img {
-            width: 14px;
-            height: 14px;
-            display: inline-block;
-            vertical-align: top;
-            margin-right: 4px;
-          }
+        img {
+          width: 14px;
+          height: 14px;
+          display: inline-block;
+          vertical-align: top;
+          margin-right: 4px;
         }
       }
     }
   }
-  & .list_context_m{
-    background-color: var(--widget-grid-bg);
-    margin-top: .5rem;
-    border-radius: .25rem;
-    position: relative;
-    overflow: hidden;
-    height: 9.5rem;
-    padding:.5rem;
-    &::after{
-      content: '';
-      height: 3.125rem;
-      position: absolute;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      background-image: var(--mask-blur);
-      z-index: 2;
-    }
-    & .swiper_container_m{
-      height: 100%;
-      & .swiper_item_m{
+}
+.list_context_m{
+  background-color: var(--widget-grid-bg);
+  border-radius: .25rem;
+  position: relative;
+  overflow: hidden;
+  height: 2.4rem;
+  padding:0.2rem .5rem;
+  width: 100%;
+  &::after{
+    content: '';
+    height: 1.125rem;
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-image: var(--mask-blur);
+    z-index: 2;
+  }
+  & .swiper_container_m{
+    height: 100%;
+    & .swiper_item_m{
+      display: flex;
+      align-items: center;
+      height: 2rem;
+      justify-content: space-between;
+      & .game_icon_m{
+        width: 2rem;
+        height: 2rem;
+        img {
+          border-radius: var(--border-radius);
+        }
+      }
+      & .user_name_m{
+        //display: flex;
+        //align-items: center;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        margin: 0 .5rem;
+        max-width: 5rem;
+        color: var(--text);
+        font-size: 0.825rem;
+      }
+      & .play_btn{
+        margin-left: auto;
         display: flex;
         align-items: center;
-        height: 2.5rem;
-        & .game_icon_m{
-          width: 2.5rem;
-          height: 2.5rem;
-          img {
-            border-radius: var(--border-radius);
-          }
-        }
-        & .user_name_m{
-          display: flex;
+        justify-content: center;
+        & .user_money{
+          display: inline-flex;
           align-items: center;
           white-space: nowrap;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          margin: 0 .5rem;
-          width: 22%;
-          color: var(--text);
-        }
-        & .play_btn{
-          margin-left: auto;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          & .user_money{
-            display: inline-flex;
-            align-items: center;
-            white-space: nowrap;
-            justify-content: flex-end;
-            margin-right: 0.875rem;
-            & .amount_m{
-              color: var(--primary-color);
-              font-weight: 700;
-              max-width: 10em;
-              text-align: right;
-            }
-            & .coin_m{
-              width: 0.875rem;
-              height: 0.875rem;
-              margin-left: 0.2em;
-            }
+          justify-content: flex-end;
+          //margin-right: 0.875rem;
+          & .amount_m{
+            color: var(--primary-color);
+            font-weight: 700;
+            max-width: 10em;
+            text-align: right;
           }
-          & .icon_arrow{
-            width: .875rem;
-            height: 1.4em;
-            fill: var(--text);
+          & .coin_m{
+            width: 0.875rem;
+            height: 0.875rem;
+            margin-left: 0.2em;
           }
         }
+        & .icon_arrow{
+          width: .875rem;
+          height: 1.4em;
+          fill: var(--text);
+        }
       }
     }
   }

+ 1 - 0
src/components/Logo/styles.module.scss

@@ -15,6 +15,7 @@
     }
     .logo_img {
         height: 3rem;
+        width: auto;
     }
 
     &.sm {

+ 4 - 3
src/components/TruncatedText.jsx

@@ -7,6 +7,7 @@ import {useThemeProvider} from '@contexts/themeContext';
 
 // utils
 import PropTypes from 'prop-types';
+import React, { Component } from 'react';
 
 var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
@@ -20,8 +21,8 @@ function _possibleConstructorReturn(self, call) { if (!self) { throw new Referen
 
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
 
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
+
+// import PropTypes from 'prop-types';
 
 var Truncate = function (_Component) {
     _inherits(Truncate, _Component);
@@ -457,4 +458,4 @@ TruncatedText.propTypes = {
     className: PropTypes.string,
 }
 
-export default TruncatedText
+export default TruncatedText

+ 5 - 5
src/layout/Navbar/styles.module.scss

@@ -51,8 +51,8 @@
   font-weight: 600 !important;
   &_mobile{
     background-color: var(--nav-item-hover) !important;
-    width: 7.89rem !important;
-    height:2.5rem !important;
+    width: 6.3rem !important;
+    height:2rem !important;
   }
 }
 .btn_sign_up{
@@ -65,9 +65,9 @@
   font-weight: 600 !important;
   margin-right: 1.5rem !important;
   &_mobile{
-    width: 7.89rem !important;
-    height:2.5rem !important;
-    margin-right: 0.5rem !important;
+    width: 6.3rem !important;
+    height:2rem !important;
+    margin-right: 0.1rem !important;
   }
 }
 .mobile-top-navigate-list{

+ 1 - 0
src/widgets/ModuleGameTabs/index.jsx

@@ -25,6 +25,7 @@ const ModuleGameTabs=({data})=>{
         tabdata.data=items;
     }
     parseTabs();
+    console.log(tabdata)
     return (
         <div className={``}>
             <GameTabs data={tabdata}>