From d54ff5ba2be4ce59f390a4e0ca1421d658f430b1 Mon Sep 17 00:00:00 2001
From: Matthias Feyll <matthias.feyll@@stud.h-da.de>
Date: Thu, 9 Jan 2025 19:07:17 +0100
Subject: [PATCH] (ui): minor css improvements
---
react-ui/src/components/devices/view/device.scss | 1 +
.../components/devices/view/device.view.table.tsx | 2 --
.../src/components/devices/view/device.view.tabs.tsx | 2 --
react-ui/src/components/devices/view/device.view.tsx | 12 ++++++------
react-ui/vite.config.mjs | 1 -
5 files changed, 7 insertions(+), 11 deletions(-)
diff --git a/react-ui/src/components/devices/view/device.scss b/react-ui/src/components/devices/view/device.scss
index 540cd4d01..866ce81eb 100755
--- a/react-ui/src/components/devices/view/device.scss
+++ b/react-ui/src/components/devices/view/device.scss
@@ -57,5 +57,6 @@
&.active {
color: map-get($theme-colors, primary);
font-weight: 500;
+ text-decoration: underline;
}
}
diff --git a/react-ui/src/components/devices/view/device.view.table.tsx b/react-ui/src/components/devices/view/device.view.table.tsx
index 56ad05f3f..8800010e2 100755
--- a/react-ui/src/components/devices/view/device.view.table.tsx
+++ b/react-ui/src/components/devices/view/device.view.table.tsx
@@ -48,7 +48,6 @@ export const DeviceViewTable = (searchRef: MutableRefObject<HTMLInputElement>) =
<td data-copy-value={deviceId} dangerouslySetInnerHTML={{ __html: search ? insertMarkTags(cropedId, search) : DOMPurify.sanitize(cropedId) }}></td>
</OverlayTrigger>
<td data-copy-value={username} dangerouslySetInnerHTML={{ __html: search ? insertMarkTags(username, search) : DOMPurify.sanitize(username) }}></td>
- <td></td>
</tr>
)
})
@@ -61,7 +60,6 @@ export const DeviceViewTable = (searchRef: MutableRefObject<HTMLInputElement>) =
<th>{t('device.table.header.name')}</th>
<th>{t('device.table.header.uuid')}</th>
<th>{t('device.table.header.user')}</th>
- <th>{t('device.table.header.last_updated')}</th>
</tr>
</thead>
<tbody>
diff --git a/react-ui/src/components/devices/view/device.view.tabs.tsx b/react-ui/src/components/devices/view/device.view.tabs.tsx
index a2768a0ea..ef8ba120f 100755
--- a/react-ui/src/components/devices/view/device.view.tabs.tsx
+++ b/react-ui/src/components/devices/view/device.view.tabs.tsx
@@ -24,8 +24,6 @@ export const DeviceViewTabs = (activeTab: DeviceViewTabValues) => {
<>
{jsonYang &&
<JsonViewer json={jsonYang} />
-
- //<ReactJson src={selectedDevice.json} name={false} collapsed={true} quotesOnKeys={false} />
}
</>
);
diff --git a/react-ui/src/components/devices/view/device.view.tsx b/react-ui/src/components/devices/view/device.view.tsx
index a2c8458a7..518c12af4 100755
--- a/react-ui/src/components/devices/view/device.view.tsx
+++ b/react-ui/src/components/devices/view/device.view.tsx
@@ -15,19 +15,19 @@ const DeviceView = () => {
<div className='m-4 pt-4'>
<Container fluid>
<Row>
- <Col sm={5}>
+ <Col lg={5} sm={12}>
<Container className='bg-white rounded c-box'>
<Row>
<Col sm={12} className='mt-4'><h3 className='text-black-50'>{t('device.title')}</h3></Col>
</Row>
<Row className='align-items-center'>
- <Col sm={6}>
+ <Col xs={12} sm={6}>
<Form.Group controlId='device.search' className='p-0 mx-1 pt-2'>
<Form.Control type="text" placeholder={t('device.search.placeholder')} ref={searchRef} />
</Form.Group>
</Col>
- <Col sm={{ span: 3, offset: 3 }} className='pt-2'>
+ <Col xs={12} sm={6} className='pt-2'>
<Button variant='primary' className='w-100 my-auto'>{t('device.add_device_button')}</Button>
</Col>
</Row>
@@ -39,10 +39,10 @@ const DeviceView = () => {
</Row>
</Container>
</Col>
- <Col sm={7}>
+ <Col xs={12} lg={7} className='mt-5 mt-lg-0'>
<Container className='bg-white rounded c-box'>
<Row>
- <Col sm={12} className='mt-4'>
+ <Col xs={12} className='mt-4'>
<Nav className='justify-content-around'>
<NavLink className={handleActiveTabLink(DeviceViewTabValues.METADATA) + " tab-links"} onClick={() => setActiveTab(DeviceViewTabValues.METADATA)}>{t('device.tabs.metadata.title')}</NavLink>
<NavLink className={handleActiveTabLink(DeviceViewTabValues.YANGMODEL) + " tab-links"} onClick={() => setActiveTab(DeviceViewTabValues.YANGMODEL)}>{t('device.tabs.yang_model.title')}</NavLink>
@@ -51,7 +51,7 @@ const DeviceView = () => {
</Row>
<Row className='align-items-start'>
- <Col sm={12} className='pt-2'>
+ <Col xs={12}>
{DeviceViewTabs(activeTab)}
</Col>
</Row>
diff --git a/react-ui/vite.config.mjs b/react-ui/vite.config.mjs
index 1304138c1..33fd69cc7 100755
--- a/react-ui/vite.config.mjs
+++ b/react-ui/vite.config.mjs
@@ -1,7 +1,6 @@
import react from '@vitejs/plugin-react';
import { defineConfig } from 'vite';
-
export default defineConfig({
plugins: [react()],
build: {
--
GitLab