Skip to content

P
purescript-gargantext
Commit 856a4c22 authored by Przemyslaw Kaminski's avatar Przemyslaw Kaminski
Browse files
Options

[tree] some styling fixes

parent 67b99a78
Hide whitespace changes
Inline Side-by-side
Showing with 22 additions and 17 deletions
dist/styles/Tree.css
View file @ 856a4c22
...@@ -36,6 +36,7 @@ li .leaf:hover a.settings { ...@@ -36,6 +36,7 @@ li .leaf:hover a.settings {
.tree ul li::before { .tree ul li::before {
bottom: -12px; bottom: -12px;
content: " "; content: " ";
height: 7px;
position: absolute; position: absolute;
top: 5px; top: 5px;
} }
...@@ -50,6 +51,15 @@ li .leaf:hover a.settings { ...@@ -50,6 +51,15 @@ li .leaf:hover a.settings {
width: 1px; width: 1px;
top: 5px; top: 5px;
} }
.tree ul li.with-children::after {
background-color: #000;
}
.tree ul li.with-children::before {
background-color: #000;
}
.tree .lefthanded .leaf {
justify-content: flex-end;
}
.tree .lefthanded ul { .tree .lefthanded ul {
margin-right: 5px; margin-right: 5px;
} }
...@@ -58,17 +68,15 @@ li .leaf:hover a.settings { ...@@ -58,17 +68,15 @@ li .leaf:hover a.settings {
padding-right: 5px; padding-right: 5px;
} }
.tree .lefthanded ul li.with-children::after { .tree .lefthanded ul li.with-children::after {
background-color: #000;
right: -10px; right: -10px;
width: 5px; width: 5px;
} }
.tree .lefthanded ul li.with-children::before { .tree .lefthanded ul li.with-children::before {
background-color: #000;
right: -10px; right: -10px;
width: 1px; width: 1px;
} }
.tree .lefthanded ul li .leaf { .tree .righthanded .leaf {
justify-content: flex-end; justify-content: flex-start;
} }
.tree .righthanded ul { .tree .righthanded ul {
margin-left: 5px; margin-left: 5px;
...@@ -78,12 +86,10 @@ li .leaf:hover a.settings { ...@@ -78,12 +86,10 @@ li .leaf:hover a.settings {
padding-left: 5px; padding-left: 5px;
} }
.tree .righthanded ul li.with-children::after { .tree .righthanded ul li.with-children::after {
background-color: #000;
left: -10px; left: -10px;
width: 5px; width: 5px;
} }
.tree .righthanded ul li.with-children::before { .tree .righthanded ul li.with-children::before {
background-color: #000;
left: -10px; left: -10px;
width: 1px; width: 1px;
} }
...@@ -91,9 +97,6 @@ li .leaf:hover a.settings { ...@@ -91,9 +97,6 @@ li .leaf:hover a.settings {
background-color: #000; background-color: #000;
right: 10px; right: 10px;
} }
.tree .righthanded ul li .leaf {
justify-content: flex-start;
}
.tree .file-dropped { .tree .file-dropped {
background-color: #d8dfe5; background-color: #d8dfe5;
} }
......
dist/styles/Tree.sass
View file @ 856a4c22
...@@ -31,6 +31,7 @@ li ...@@ -31,6 +31,7 @@ li
&::before &::before
bottom: -12px bottom: -12px
content: " " content: " "
height: 7px
position: absolute position: absolute
top: 5px top: 5px
&:not(:first-child):last-child::before &:not(:first-child):last-child::before
...@@ -43,8 +44,15 @@ li ...@@ -43,8 +44,15 @@ li
position: absolute position: absolute
width: 1px width: 1px
top: 5px top: 5px
&.with-children
&::after
background-color: #000
&::before
background-color: #000
.lefthanded .lefthanded
.leaf
justify-content : flex-end
ul ul
margin-right : 5px margin-right : 5px
li li
...@@ -52,18 +60,16 @@ li ...@@ -52,18 +60,16 @@ li
padding-right: 5px padding-right: 5px
&.with-children &.with-children
&::after &::after
background-color: #000
right: -10px right: -10px
width: 5px width: 5px
&::before &::before
background-color: #000
right: -10px right: -10px
width: 1px width: 1px
&:only-child::before &:only-child::before
//right: 1px //right: 1px
.leaf
justify-content : flex-end
.righthanded .righthanded
.leaf
justify-content : flex-start
ul ul
margin-left : 5px margin-left : 5px
li li
...@@ -71,18 +77,14 @@ li ...@@ -71,18 +77,14 @@ li
padding-left: 5px padding-left: 5px
&.with-children &.with-children
&::after &::after
background-color: #000
left: -10px left: -10px
width: 5px width: 5px
&::before &::before
background-color: #000
left: -10px left: -10px
width: 1px width: 1px
&:only::before &:only::before
background-color: #000 background-color: #000
right: 10px right: 10px
.leaf
justify-content : flex-start
.file-dropped .file-dropped
background-color: #d8dfe5 background-color: #d8dfe5
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment