extern/nightTab
1
0
Fork 0
mirror of https://github.com/zombieFox/nightTab.git synced 2025-06-26 12:31:47 +02:00
Code Issues Packages Projects Releases Wiki Activity

[design] improve group name and controls

Browse Source
This commit is contained in:
zombieFox 2019-10-22 12:55:27 +01:00
parent 16d6eb1eae
commit 31f07d925a
1 changed files with 13 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/css/group.css
View File

@ -29,8 +29,8 @@
flex-direction: row; flex-direction: row;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: nowrap;
transition: padding var(--layout-timing-extra-fast) var(--layout-duration-04); transition: padding var(--layout-timing-extra-fast);
} }
.is-group-name-show .group-header, .is-group-name-show .group-header,
@ -41,19 +41,26 @@
.group-name { .group-name {
margin-right: 0; margin-right: 0;
display: none; display: flex;
align-items: center; align-items: center;
min-height: 2.5em; height: 0;
overflow: hidden;
font-size: var(--group-name-size); font-size: var(--group-name-size);
transition: height var(--layout-timing-extra-fast);
transition: height var(--layout-timing-extra-fast);
} }
.is-group-name-show .group-name { .is-group-name-show .group-name {
display: flex; display: flex;
height: 2.5em;
} }
.group-name-text { .group-name-text {
font-family: var(--font-fjalla); font-family: var(--font-fjalla);
margin-bottom: 0; margin-bottom: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
} }
.group-control { .group-control {
@ -62,6 +69,7 @@
overflow: hidden; overflow: hidden;
height: 0; height: 0;
width: 0; width: 0;
flex-shrink: 0;
transition: transition:
width var(--layout-timing-extra-fast), width var(--layout-timing-extra-fast),
height var(--layout-timing-extra-fast) var(--layout-duration-04), height var(--layout-timing-extra-fast) var(--layout-duration-04),
@ -69,6 +77,7 @@
} }
.is-link-edit .group-control { .is-link-edit .group-control {
margin-right: 1em;
height: 2.5em; height: 2.5em;
width: 16em; width: 16em;
transition: transition:
@ -77,10 +86,6 @@
margin var(--layout-timing-extra-fast) var(--layout-duration-04); margin var(--layout-timing-extra-fast) var(--layout-duration-04);
} }
.is-link-edit.is-group-name-show .group-control {
margin-right: 1em;
}
.group-control-item { .group-control-item {
width: 4em; width: 4em;
flex-shrink: 0; flex-shrink: 0;