diff options
| author | Jan-Christoph Borchardt <hey@jancborchardt.net> | 2020-01-21 12:32:06 +0800 |
|---|---|---|
| committer | Jan-Christoph Borchardt <hey@jancborchardt.net> | 2020-06-07 01:00:38 +0200 |
| commit | c70bfe55c9a6688a1300409de5687d181f80625c (patch) | |
| tree | dd32d6a4c4a22a4b91cf6f93577a4120fbfc3f2b /css | |
| parent | 9efb9d245bfbe08ead6b9d71c87095b7528fbec9 (diff) | |
Hide delete icons initially to not overflow interface
Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
Diffstat (limited to 'css')
| -rw-r--r-- | css/Properties/Properties.scss | 25 |
1 files changed, 17 insertions, 8 deletions
diff --git a/css/Properties/Properties.scss b/css/Properties/Properties.scss index 8dbf2785..161b2399 100644 --- a/css/Properties/Properties.scss +++ b/css/Properties/Properties.scss @@ -135,6 +135,11 @@ $property-ext-padding-right: 8px; } } + // Hide delete buttons initially + .action-item.icon-delete { + opacity: 0; + } + // Property value within row, after label &__value { flex: 1 1; @@ -152,18 +157,22 @@ $property-ext-padding-right: 8px; input&--with-ext { // ext icon width + 8px padding padding-right: 24px; - &:hover, - &:focus, - &:active { - ~ .property__ext { - opacity: .5; - } + } + + // Show ext and delete icon permanently on focus + &:hover, + &:focus, + &:active { + ~ .property__ext, + ~ .action-item.icon-delete { + opacity: .5; } } } - // show ext button on full row hover - &:hover &__ext { + // Show ext and delete buttons on full row hover + &:hover &__ext, + &:hover .action-item.icon-delete { opacity: .5; } |