flexbox for footer, divide into github, resources

architec · Nov 19, 2021 · ec9033e · ec9033e
1 parent 1dbc8c1
commit ec9033e
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/src/pages/Popup/Popup.jsx b/src/pages/Popup/Popup.jsx
@@ -154,14 +154,16 @@ class Popup extends Component {
             {itemsList}
           </List>
           <div class="footer" >
+            <div>
             <IconButton
               edge="end"
               size="small"
               aria-label="delete"
               onClick={(e) => { chrome.tabs.update({ url: 'https://github.com/arch-org/mistake' }); e.preventDefault(); }}
             >
               <GitHubIcon style={{ fontSize: 'xx-small' }} />
-            </IconButton>
+            </IconButton></div>
+            <div>
             <IconButton
               edge="end"
               size="small"
@@ -177,7 +179,7 @@ class Popup extends Component {
               onClick={(e) => { chrome.tabs.update({ url: 'https://leetcode.com/discuss/general-discussion/460599/blind-75-leetcode-questions' }); e.preventDefault(); }}
             >
               <AccountTreeIcon style={{ fontSize: 'xx-small' }} />
-            </IconButton>
+            </IconButton></div>
           </div>
         </header>
       </div>

diff --git a/src/pages/Popup/index.css b/src/pages/Popup/index.css
@@ -24,4 +24,6 @@ code {
   text-align: center;
   font-size: xx-small;
   position: absolute;
+  display: flex;
+  justify-content: space-around;
 }