cleanup some stuff

odota · Jul 7, 2019 · c387935 · c387935
1 parent de935b5
commit c387935
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 19 deletions.
diff --git a/src/components/TeamBuilderPage/TeamBuilderPage.jsx b/src/components/TeamBuilderPage/TeamBuilderPage.jsx
@@ -10,15 +10,12 @@ import { strings } from './../Localization/Localization';
 import querystring from 'querystring';
 
 // TODO: to unify this logic with /components/AllianceCard/AllianceCard.tsx
-const Synergy = ({synergy, count, level, levelUnitCount, handleAllianceFilter}) => {
+const Synergy = ({synergy, count, level, handleAllianceFilter}) => {
   const alliance = alliances[synergy];
   const tiers = alliance.levels.map((level,i) => level.unitcount - (i > 0 ? alliance.levels[i-1].unitcount : 0));
   let c = count;
   return(
-    <div 
-    className={styles.activeAllianceContainerOuter}
-    style={{background: level > 0 ? `radial-gradient(ellipse at 50% 80%, rgba(134, 233, 255, 0.17), rgba(255, 255, 255, 0.1))` : 'rgba(255, 255, 255, 0.03'}}
-    >
+    <div className={`${styles.activeAllianceContainerOuter} ${level > 0 ? styles.active : null}`}>
       <div className={styles.activeAllianceContainer} style={{backgroundColor: `rgba(${alliance.color.split(' ').join(',')},.22)`}}>
         <div className={styles.allianceImgContainer} data-tip={synergy} data-for="alliance" data-offset="{'top': 0, 'left': 250}">
           <img 
@@ -49,7 +46,7 @@ const Synergy = ({synergy, count, level, levelUnitCount, handleAllianceFilter})
       </div>
     {level ? 
       <div className={styles.synergyDescription}>
-        {`(${levelUnitCount}) ${underlordsLoc[`dac_synergy_desc_${synergy}_${level}`]}`}
+        {`(${tiers[level-1]}) ${underlordsLoc[`dac_synergy_desc_${synergy}_${level}`]}`}
       </div> 
     : 
       <div className={`${styles.synergyDescription} ${styles.nonActive}`}>
@@ -105,7 +102,6 @@ export default class TeamBuilderPage extends React.Component {
               alliance.levels.forEach((level, index) => {
                 if(synergies[alliance.key].count >= level.unitcount) {
                   synergies[alliance.key].level = index + 1;
-                  synergies[alliance.key].levelUnitCount = level.unitcount;
                 }
               })       
             }

diff --git a/src/components/TeamBuilderPage/TeamBuilderPage.module.css b/src/components/TeamBuilderPage/TeamBuilderPage.module.css
@@ -18,6 +18,7 @@
     width: 100%;
     padding-bottom: 10px;
     border-bottom: 1px solid rgba(255, 255, 255, 0.05);
+    color: rgba(255,255,255,0.81);
 }
 
 .heroImageSelectionArea {
@@ -123,9 +124,15 @@ input[type="text"], textarea {
     cursor: pointer;
     box-sizing: border-box;
     box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px 0px;
-    flex-basis: 49%;
+    flex-basis: 307px;
     margin-bottom: 10px;
     padding: 10px;
+    background: rgba(255, 255, 255, 0.03);
+    justify-content: space-between;
+}
+
+.activeAllianceContainerOuter.active {
+    background: radial-gradient(ellipse at 50% 80%, rgba(134, 233, 255, 0.17), rgba(255, 255, 255, 0.1));
 }
 
 .activeAllianceContainer {
@@ -184,13 +191,14 @@ input[type="text"], textarea {
 .synergyDescription {
     font-size: 12px;
     color: rgba(255, 255, 255, 0.81);
-    margin-left: 10px;
     font-weight: 550;
+    width: 187px;
 }
 
 .synergyDescription.nonActive {
     color: rgba(255, 255, 255, 0.5);
     font-weight: normal;
+    text-shadow: none;
 }
 
 .allianceFilterContainer {
@@ -235,6 +243,9 @@ input[type="text"], textarea {
     .teamBuilderPageContainer {
         flex-wrap: wrap;
     }
+    .synergiesContainer {
+        justify-content: center;
+    }
     .teamArea { 
         margin-left: 0px;
         padding-left:0px;
@@ -251,16 +262,6 @@ input[type="text"], textarea {
 }
 
 @media (max-width: 450px) {
-    .activeAllianceContainerOuter {
-        flex-basis: 100%;
-        flex-direction: row;
-    }
-    .synergiesContainer {
-        justify-content: center;
-    }
-    .synergyDescription {
-        margin-left: 10px;
-    }
     .heroImageTeamAreaContainer {
         width: auto;
     }