diff options
| author | Julius Härtl <jus@bitgrid.net> | 2020-09-16 14:08:30 +0300 |
|---|---|---|
| committer | Julius Härtl <jus@bitgrid.net> | 2020-10-08 15:55:26 +0300 |
| commit | 7b4ab74e46784d3f022ef0f666ba33fdb67a3fe1 (patch) | |
| tree | 1a21e7908d3ea3d2d837a4a6c8368be1d67a1534 /src | |
| parent | c3159689510f68e6d35512c38c6a721aa29b894d (diff) | |
Fix link menu positioning
Signed-off-by: Julius Härtl <jus@bitgrid.net>
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/MenuBubble.vue | 28 | ||||
| -rw-r--r-- | src/views/RichWorkspace.vue | 3 |
2 files changed, 22 insertions, 9 deletions
diff --git a/src/components/MenuBubble.vue b/src/components/MenuBubble.vue index c52d4da9a..5510dcef0 100644 --- a/src/components/MenuBubble.vue +++ b/src/components/MenuBubble.vue @@ -44,7 +44,7 @@ class="menububble__button" :class="{ 'is-active': isActive.link() }" @click="showLinkMenu(getMarkAttrs('link'))"> - <span v-tooltip="t('text', isActive.link() ? 'Update Link' : 'Add Link')" class="icon-link" /> + <span class="icon-link" /> <span class="menububble__buttontext"> {{ t('text', isActive.link() ? 'Update Link' : 'Add Link') }} </span> @@ -53,7 +53,7 @@ class="menububble__button" :class="{ 'is-active': isActive.link() }" @click="selectFile(commands.link)"> - <span v-tooltip="t('text', 'Link file')" class="icon-file" /> + <span class="icon-file" /> <span class="menububble__buttontext">{{ t('text', 'Link file') }}</span> </button> </template> @@ -147,13 +147,16 @@ export default { z-index: 10020; background: var(--color-main-background-translucent); box-shadow: 0 1px 5px var(--color-box-shadow); - border-radius: var(--border-radius); + border-radius: var(--border-radius-large); + overflow: hidden; padding: 0; - margin-bottom: 0.4rem; + margin-bottom: -3px; + margin-left: 10px; visibility: hidden; opacity: 0; transform: translateX(-50%); transition: opacity 0.2s, visibility 0.2s; + height: 44px; &.is-active { opacity: 1; @@ -162,15 +165,24 @@ export default { &__button { display: block; + flex-grow: 1; border: 0; - padding: 0.3rem 0.7rem; + padding: 0.9rem 0.7rem; margin: 0; - margin-right: 0.2rem; - border-radius: var(--border-radius); + border-radius: 0; cursor: pointer; + background-color: var(--color-main-background); + border-right: 1px solid var(--color-border); + + &:focus, + &:hover { + background-color: var(--color-background-hover); + border: 0; + border-right: 1px solid var(--color-border) !important; + } &:last-child { - margin-right: 0; + border: 0 !important; } } diff --git a/src/views/RichWorkspace.vue b/src/views/RichWorkspace.vue index 961f3c8f4..3229e4fb1 100644 --- a/src/views/RichWorkspace.vue +++ b/src/views/RichWorkspace.vue @@ -169,7 +169,7 @@ export default { <style lang="scss" scoped> #rich-workspace { - padding: 0 60px; + padding: 0 50px; /* Slightly reduce vertical space */ margin-bottom: -24px; text-align: left; @@ -213,6 +213,7 @@ export default { #rich-workspace::v-deep #editor { overflow: scroll !important; max-height: 50vh; + padding-left: 10px; } #rich-workspace::v-deep #editor-wrapper .ProseMirror { |