mirror/rio
1
0
Fork 0
mirror of https://github.com/rio-labs/rio.git synced 2026-04-30 07:59:37 -05:00
Code Issues Packages Projects Releases Wiki Activity

remove annoying gap between tree items

Browse Source
This commit is contained in:
Aran-Fey
2025-03-22 11:52:45 +01:00
parent e7cb441888
commit 46d6eba6a9
1 changed files with 11 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/css/dev_tools.scss
+11 -5
View File
@@ -18,7 +18,6 @@ $tree-header-icon-size: 1.3rem;
.rio-dev-tools-component-tree-item {
display: flex;
flex-direction: column;
gap: 0.2rem;
}
@keyframes flash-text {
@@ -44,7 +43,7 @@ $tree-header-icon-size: 1.3rem;
z-index: 1;
position: relative;
padding: 0.2rem 0.6rem;
padding: 0.3rem 0.6rem;
display: flex;
flex-direction: row;
@@ -86,9 +85,12 @@ $tree-header-icon-size: 1.3rem;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
// Leave some empty space at the top and bottom to create a visual gap
// between tree items
top: 0.1rem;
bottom: 0.1rem;
background: var(--rio-global-secondary-bg);
border-radius: $infinite-corner-radius;
@@ -128,7 +130,11 @@ $tree-header-icon-size: 1.3rem;
display: none;
flex-direction: column;
gap: 0.2rem;
// Note: It's important that there's no gap between tree items because the
// component highlighter rapidly jumps around whenever the cursor isn't
// hovering over a tree item, which is very irritating. Any gap between tree
// items must be visual only.
}
.rio-dev-tools-component-tree-item[data-has-children="true"][data-expanded="true"]