diff options
author | John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com> | 2017-09-14 19:27:43 +0200 |
---|---|---|
committer | John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com> | 2017-09-21 14:00:36 +0200 |
commit | f43b832d84689e6d751f1e3dbe3cf38eb914dd1f (patch) | |
tree | e9d09d9bc5fa5ab3880082d7b11340f2ed4ba1ac /core | |
parent | 99598d3f405c6c87fcd6f9248acdf3431ee0ffdb (diff) | |
download | nextcloud-server-f43b832d84689e6d751f1e3dbe3cf38eb914dd1f.tar.gz nextcloud-server-f43b832d84689e6d751f1e3dbe3cf38eb914dd1f.zip |
Align edit input with its corresponding link text and fix animation
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
Diffstat (limited to 'core')
-rw-r--r-- | core/css/apps.scss | 22 |
1 files changed, 15 insertions, 7 deletions
diff --git a/core/css/apps.scss b/core/css/apps.scss index 15161ccfab5..eab5683a5f0 100644 --- a/core/css/apps.scss +++ b/core/css/apps.scss @@ -105,11 +105,16 @@ kbd { flex-wrap: wrap; > a, - > .app-navigation-entry-deleted, - > .app-navigation-entry-edit { + > .app-navigation-entry-deleted { /* Ugly hack for overriding the main entry link */ padding-left: 44px !important; } + > .app-navigation-entry-edit { + /* Ugly hack for overriding the main entry link */ + /* align the input correctly with the link text + 44px-6px padding for the input */ + padding-left: 38px !important; + } &:focus, &:hover, @@ -253,7 +258,9 @@ kbd { } /* show edit/undo field if editing/deleted */ - &.editing .app-navigation-entry-edit, + &.editing .app-navigation-entry-edit { + opacity: 1; + } &.deleted .app-navigation-entry-deleted { transform: translateX(0); } @@ -391,8 +398,8 @@ kbd { padding-right: 5px; display: block; width: calc(100% - 1px); /* Avoid border overlapping */ - transition: transform 250ms ease-in-out; - transform: translateX(250px); + transition: opacity 250ms ease-in-out; + opacity: 0; position: absolute; background-color: $color-main-background; form { @@ -434,6 +441,7 @@ kbd { .app-navigation-entry-deleted { display: inline-flex; padding-left: 12px; + transform: translateX(250px); .app-navigation-entry-deleted-description { position: relative; white-space: nowrap; @@ -459,8 +467,8 @@ kbd { .app-navigation-entry-edit, .app-navigation-entry-deleted { width: calc(100% - 1px); /* Avoid border overlapping */ - transition: transform 250ms ease-in-out; - transform: translateX(250px); + transition: transform 250ms ease-in-out, + opacity 250ms ease-in-out; position: absolute; background-color: $color-main-background; z-index: 250; |