diff options
| author | Fabian Mastenbroek <mail.fabianm@gmail.com> | 2021-05-17 12:16:10 +0200 |
|---|---|---|
| committer | Fabian Mastenbroek <mail.fabianm@gmail.com> | 2021-05-18 15:46:43 +0200 |
| commit | 53623fad76274e39206b8e073e371775ea96946b (patch) | |
| tree | a57d23d9c1f6a924753dbb4a3a9bc9cbca5385dd /opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitTabsComponent.js | |
| parent | 688a25e560db3355e2a3ee369c2e6f4b55aab2a6 (diff) | |
ui: Migrate to FontAwesome 5 React library
This change updates the frontend to use the FontAwesome 5 React library
that renders SVG icons as opposed to CSS icon fonts. This migration
resolves a couple of issues we had with server-side rendering of the
previous FontAwesome icons.
Diffstat (limited to 'opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitTabsComponent.js')
| -rw-r--r-- | opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitTabsComponent.js | 28 |
1 files changed, 18 insertions, 10 deletions
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitTabsComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitTabsComponent.js index 6599fefd..ebb5f479 100644 --- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitTabsComponent.js +++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitTabsComponent.js @@ -1,5 +1,5 @@ import React, { useState } from 'react' -import { Nav, NavItem, NavLink, TabContent, TabPane } from 'reactstrap' +import { Nav, NavItem, NavLink, Row, TabContent, TabPane } from 'reactstrap' import UnitAddContainer from '../../../../../containers/app/sidebars/topology/machine/UnitAddContainer' import UnitListContainer from '../../../../../containers/app/sidebars/topology/machine/UnitListContainer' @@ -10,7 +10,7 @@ const UnitTabsComponent = () => { } return ( - <div> + <div className="mt-2"> <Nav tabs> <NavItem> <NavLink @@ -55,20 +55,28 @@ const UnitTabsComponent = () => { </Nav> <TabContent activeTab={activeTab}> <TabPane tabId="cpu-units"> - <UnitAddContainer unitType="cpu" /> - <UnitListContainer unitType="cpu" /> + <div className="py-2"> + <UnitAddContainer unitType="cpu" /> + <UnitListContainer unitType="cpu" /> + </div> </TabPane> <TabPane tabId="gpu-units"> - <UnitAddContainer unitType="gpu" /> - <UnitListContainer unitType="gpu" /> + <div className="py-2"> + <UnitAddContainer unitType="gpu" /> + <UnitListContainer unitType="gpu" /> + </div> </TabPane> <TabPane tabId="memory-units"> - <UnitAddContainer unitType="memory" /> - <UnitListContainer unitType="memory" /> + <div className="py-2"> + <UnitAddContainer unitType="memory" /> + <UnitListContainer unitType="memory" /> + </div> </TabPane> <TabPane tabId="storage-units"> - <UnitAddContainer unitType="storage" /> - <UnitListContainer unitType="storage" /> + <div className="py-2"> + <UnitAddContainer unitType="storage" /> + <UnitListContainer unitType="storage" /> + </div> </TabPane> </TabContent> </div> |