Home Explore Help
Sign In
DricomDragon
/
SquadComposer
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

Merge branch 'add/matcha.css'

DricomDragon 7 months ago
parent
81770e7da6 e60cf612d2
commit
60343b6f94
5 changed files with 17 additions and 4 deletions
Split View Show Diff Stats
  1. 1 0
      dev-front/public/index.html
  2. 6 0
      dev-front/public/matcha.css
  3. 8 0
      dev-front/src/App.css
  4. 1 3
      dev-front/src/App.tsx
  5. 1 1
      dev-front/src/mech/MechPicker.tsx

+ 1 - 0
dev-front/public/index.html
View File 

@@ -25,6 +25,7 @@
 
       Learn how to configure a non-root public URL by running `npm run build`.
 
     -->
 
     <title>Squad Composer</title>
 
+    <link rel="stylesheet" type="text/css" href="matcha.css">
 
   </head>
 
   <body>
 
     <noscript>You need to enable JavaScript to run this app.</noscript>

File diff suppressed because it is too large
+ 6 - 0
dev-front/public/matcha.css


+ 8 - 0
dev-front/src/App.css
View File 

@@ -18,12 +18,18 @@ header {
 
     /* Layout the left sidebar, main content and right sidebar */
 
     display: flex;
 
     flex-direction: row;
 
+    min-height: 68vh;
 
 }
 
 
 .mech-picker {
 
     width: 25%;
 
 }
 
 
+.mech-list {
 
+    overflow-y: scroll;
 
+    max-height: 68vh;
 
+}
 
+
 
 .mech-picker input {
 
     display: block;
 
 }
 
@@ -31,6 +37,7 @@ header {
 
 .custom-squad {
 
     /* Take the remaining width */
 
     flex-grow: 1;
 
+    justify-content: start;
 
 }
 
 
 .mech-members {
 
@@ -51,6 +58,7 @@ header {
 
 
 .squad-description {
 
     display: flex;
 
+    flex-grow: 1;
 
     flex-direction: column;
 
 }

+ 1 - 3
dev-front/src/App.tsx
View File 

@@ -13,10 +13,8 @@ function App() {
 
                 <h1>Squad Composer</h1>
 
             </header>
 
             <main className='editor'>
 
-                <MechPicker observers={mechPickObservers}/>
 
-
 
                 <Squad pickObservers={mechPickObservers}/>
 
-
 
+                <MechPicker observers={mechPickObservers}/>
 
             </main>
 
             <footer>Squad Composer by DricomDragon</footer>
 
         </div>

+ 1 - 1
dev-front/src/mech/MechPicker.tsx
View File 

@@ -18,7 +18,7 @@ function MechPicker({observers} : { observers: {[key: string]: MechObserver }})
 
             <h2>Mech picker</h2>
 
             <label htmlFor='search-mech-input'>Search mech</label>
 
             <input id='search-mech-input' type='text' placeholder='Mech name' value={searchText} onChange={event => setSearchText(event.target.value)}/>
 
-            <ul>
 
+            <ul className='mech-list'>
 
                 {mechData
 
                     .filter(mech => mech.name.toLowerCase().includes(searchText.toLocaleLowerCase()))
 
                     .map(mech => (