MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update feedback icon to be in line with new UI

This commit is contained in:
Andrew Kingston 2020-10-28 10:59:43 +00:00
parent 4e45546aff
commit 7c3732d2f4
2 changed files with 19 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
packages/builder/src/components/userInterface/Feedback/FeedbackNavLink.svelte
View File

@ -1,5 +1,4 @@
<script> <script>
import { FeedbackIcon } from "components/common/Icons/"
import { Popover } from "@budibase/bbui" import { Popover } from "@budibase/bbui"
import { store } from "builderStore" import { store } from "builderStore"
@ -16,41 +15,37 @@
}, FIVE_MINUTES) }, FIVE_MINUTES)
</script> </script>
<span <div class="container" bind:this={iconContainer} on:click={popover.show}>
class="container" <i class="ri-feedback-line" class:highlight={$store.highlightFeedbackIcon} />
bind:this={iconContainer} </div>
on:click={popover.show}
class:highlight={$store.highlightFeedbackIcon}>
<FeedbackIcon />
</span>
<Popover bind:this={popover} anchor={iconContainer} align="right"> <Popover bind:this={popover} anchor={iconContainer} align="right">
<FeedbackIframe on:finished={popover.hide} /> <FeedbackIframe on:finished={popover.hide} />
</Popover> </Popover>
<style> <style>
i {
font-size: 18px;
color: var(--grey-7);
}
i.highlight {
color: var(--blue);
filter: drop-shadow(0 0 20px var(--blue));
}
.container { .container {
cursor: pointer; cursor: pointer;
color: var(--grey-7); color: var(--grey-7);
margin: 0 20px 0 0; margin: 0 12px 0 0;
font-weight: 500; font-weight: 500;
font-size: 1rem; font-size: 1rem;
height: 100%;
display: flex; display: flex;
flex: 1; flex-direction: row;
justify-content: center;
align-items: center; align-items: center;
box-sizing: border-box; height: 24px;
width: 24px;
} }
.container:hover i {
.container:hover {
color: var(--ink); color: var(--ink);
font-weight: 500;
}
.highlight {
color: var(--blue);
}
.highlight > :global(svg) {
filter: drop-shadow(0 0 20px var(--blue));
} }
</style> </style>

2
packages/builder/src/pages/[application]/_reset.svelte
View File

@ -67,7 +67,6 @@
</div> </div>
<div class="toprightnav"> <div class="toprightnav">
<FeedbackNavLink /> <FeedbackNavLink />
<SettingsLink />
<div class="topnavitemright"> <div class="topnavitemright">
<a target="_blank" href="https://docs.budibase.com"> <a target="_blank" href="https://docs.budibase.com">
<i class="ri-question-line" /> <i class="ri-question-line" />
@ -80,6 +79,7 @@
<i class="ri-discuss-line" /> <i class="ri-discuss-line" />
</a> </a>
</div> </div>
<SettingsLink />
<Button <Button
secondary secondary
on:click={() => { on:click={() => {