Misc fixed and lightmode improvements

This commit is contained in:
Sacha Weatherstone
2022-02-17 21:39:28 +11:00
parent fe84b27059
commit 6c023d6656
11 changed files with 92 additions and 92 deletions
+3 -3
View File
@@ -39,8 +39,8 @@ export const FileBrowser = (): JSX.Element => {
return (
<div className="flex h-full w-full select-none flex-col gap-4 p-4">
<div className="w-full flex-grow rounded-md bg-gray-200 dark:bg-primaryDark">
<div className="flex h-10 w-full rounded-t-md bg-gray-300 px-4 text-lg font-semibold dark:bg-zinc-700 dark:text-white">
<div className="w-full flex-grow rounded-md bg-white dark:bg-primaryDark">
<div className="flex h-10 w-full rounded-t-md border-b border-gray-300 px-4 text-lg font-semibold shadow-md dark:border-gray-600 dark:bg-zinc-700 dark:text-white">
<div className="my-auto w-1/3">FileName</div>
<div className="my-auto w-1/3">Actions</div>
</div>
@@ -63,7 +63,7 @@ export const FileBrowser = (): JSX.Element => {
{data?.data.files.map((file) => (
<div
key={file.name}
className="flex h-10 w-full border-b border-gray-500 px-4 font-medium dark:text-white"
className="flex h-10 w-full border-b border-gray-300 px-4 font-medium dark:border-gray-600 dark:text-white"
>
<div className="my-auto w-1/3">
<a
+4 -8
View File
@@ -1,6 +1,5 @@
import React from 'react';
import { m } from 'framer-motion';
import JSONPretty from 'react-json-pretty';
import { useAppSelector } from '@app/hooks/useAppSelector';
@@ -17,20 +16,17 @@ export const Info = (): JSX.Element => {
);
return (
<div className="flex w-full flex-grow select-none flex-col gap-4 p-4">
<m.div
whileHover={{ scale: 1.01 }}
className="flex w-full flex-col gap-4 rounded-md p-8 shadow-md dark:bg-primaryDark"
>
<div className="flex h-full flex-col gap-4 p-4 md:flex-row">
<div className="flex w-full flex-col gap-4 rounded-md bg-white p-8 shadow-md dark:bg-primaryDark md:w-1/4">
<div className="m-auto">
<Hashicon value={hardwareInfo.myNodeNum.toString()} size={180} />
</div>
<div className="text-center text-lg font-medium dark:text-white">
{node?.user?.longName || 'Unknown'}
</div>
</m.div>
</div>
<div className="flex-grow rounded-md p-8 shadow-md dark:bg-primaryDark">
<div className="flex-grow rounded-md bg-white p-8 shadow-md dark:bg-primaryDark">
<JSONPretty className="overflow-y-auto" data={hardwareInfo} />
</div>
</div>
+17 -6
View File
@@ -48,9 +48,8 @@ export const Logs = (): JSX.Element => {
};
return (
<div className="flex h-full p-4 ">
<table className="table-cell h-full w-full select-none rounded-md dark:bg-primaryDark">
{/* \/ flex flex-col gap-2 */}
<div className="flex h-full p-4">
<table className="table-cell h-full w-full select-none rounded-md bg-white dark:bg-primaryDark">
<tbody
className="
block h-full flex-col overflow-y-auto py-4 px-2 font-mono text-xs dark:text-gray-400"
@@ -71,13 +70,24 @@ export const Logs = (): JSX.Element => {
)}
</AnimatePresence>
{logs.map((log, index) => (
<tr key={index} className="group hover:bg-secondaryDark">
// <ContextMenu
// key={index}
// items={
// <>
// <ContextItem title="Test" icon={<FiGitBranch />} />
// </>
// }
// >
<tr
key={index}
className="group hover:bg-gray-200 dark:hover:bg-secondaryDark"
>
<m.td
className="w-6 cursor-pointer"
whileHover={{ scale: 1.01 }}
whileTap={{ scale: 0.99 }}
>
<div className="m-auto pl-2 dark:text-primaryDark dark:group-hover:text-gray-400">
<div className="m-auto pl-2 text-white group-hover:text-black dark:text-primaryDark dark:group-hover:text-gray-400">
<FiArrowRight />
</div>
</m.td>
@@ -112,6 +122,7 @@ export const Logs = (): JSX.Element => {
</td>
<td className="truncate pl-1">{log.message}</td>
</tr>
// </ContextMenu>
))}
</tbody>
</table>
@@ -128,7 +139,7 @@ const Wrapper = ({
}): JSX.Element => (
<td className={className}>
<m.div
className="-my-0.5 flex max-w-min cursor-pointer truncate rounded-sm px-0.5 hover:bg-gray-700"
className="-my-0.5 flex max-w-min cursor-pointer truncate rounded-sm px-0.5 hover:bg-gray-400 dark:hover:bg-gray-700"
whileHover={{ scale: 1.01 }}
whileTap={{ scale: 0.99 }}
>