diff --git a/frontend/src/components/grid-items.svelte b/frontend/src/components/grid-items.svelte
index 50656c9..330fb8e 100644
--- a/frontend/src/components/grid-items.svelte
+++ b/frontend/src/components/grid-items.svelte
@@ -9,6 +9,7 @@
export let activeKey = '';
export let activeChildKey = '';
export let level = 0;
+ export let striped = true;
const dispatch = createEventDispatcher();
let childrenOpen = {};
@@ -90,6 +91,7 @@
on:dblclick={() => doubleClick(item[key])}
on:contextmenu|preventDefault={evt => showContextMenu(evt, item)}
class:selected={activeKey === item[key] && !activeChildKey}
+ class:striped
>
{#if item.children?.length}
@@ -117,6 +119,7 @@
+ tr.striped:nth-of-type(even) td {
+ background-color: #eee;
+ }
+ tr.selected td {
+ background-color: #00008b !important;
+ color: #fff;
+ }
+
td {
padding: 0.3rem;
text-overflow: ellipsis;
@@ -145,11 +156,6 @@
max-width: 25em;
}
- tbody tr.selected td {
- background-color: #00008b;
- color: #fff;
- }
-
button.toggle {
color: inherit;
padding: 0;
diff --git a/frontend/src/components/grid.svelte b/frontend/src/components/grid.svelte
index b68d00c..53d14df 100644
--- a/frontend/src/components/grid.svelte
+++ b/frontend/src/components/grid.svelte
@@ -9,10 +9,10 @@
export let activeKey = '';
export let activeChildKey = '';
export let showHeaders = true;
- export let level = 0;
+ export let striped = true;
- 0}>
+
{#if actions?.length}
{#each actions as action}
@@ -37,7 +37,7 @@
{/if}
-
+
@@ -48,9 +48,6 @@
height: 100%;
background-color: #fff;
}
- .subgrid {
- width: 100%;
- }
.actions {
margin-bottom: 0.5rem;
@@ -64,7 +61,7 @@
table {
border-collapse: collapse;
width: 100%;
- /* table-layout: fixed; */
+ background-color: #fff;
}
table thead {
diff --git a/frontend/src/components/objectgrid.svelte b/frontend/src/components/objectgrid.svelte
index 9d8d5b5..6fec75b 100644
--- a/frontend/src/components/objectgrid.svelte
+++ b/frontend/src/components/objectgrid.svelte
@@ -20,8 +20,10 @@
if (Array.isArray(data)) {
for (const item of data) {
const newItem = {};
- newItem.key = item[key];
- newItem.children = dissectObject(item);
+ newItem.key = key;
+ newItem.value = item[key];
+ newItem.type = getType(item[key]);
+ newItem.children = dissectObject(item, key);
newItem.menu = item.menu;
items = [ ...items, newItem ];
}
@@ -53,9 +55,9 @@
}
}
- function dissectObject(object) {
+ function dissectObject(object, exclude) {
const entries = [ ...Array.isArray(object) ? object.entries() : Object.entries(object) ];
- return entries.map(([ key, value ]) => {
+ return entries.filter(([ key ]) => key != exclude).map(([ key, value ]) => {
key = key + '';
const type = getType(value);
const child = { key, value, type, menu: value.menu };
diff --git a/frontend/src/organisms/addressbar/hostmodal.svelte b/frontend/src/organisms/addressbar/hostmodal.svelte
index 8f5d45e..ace8ae0 100644
--- a/frontend/src/organisms/addressbar/hostmodal.svelte
+++ b/frontend/src/organisms/addressbar/hostmodal.svelte
@@ -60,6 +60,7 @@
border-radius: 0;
background: #eee;
color: inherit;
+ border: none;
border-left: 1px solid #ccc;
}
.host button:hover {
diff --git a/frontend/src/organisms/connection/dblist.svelte b/frontend/src/organisms/connection/dblist.svelte
index 856f403..b5c456c 100644
--- a/frontend/src/organisms/connection/dblist.svelte
+++ b/frontend/src/organisms/connection/dblist.svelte
@@ -74,6 +74,7 @@
{#if host && connection}
({
id: dbKey,
|