diff options
Diffstat (limited to 'src/components/Global/Popover.vue')
-rw-r--r-- | src/components/Global/Popover.vue | 42 |
1 files changed, 27 insertions, 15 deletions
diff --git a/src/components/Global/Popover.vue b/src/components/Global/Popover.vue index b91aa08b..bae121c3 100644 --- a/src/components/Global/Popover.vue +++ b/src/components/Global/Popover.vue @@ -1,7 +1,22 @@ <template> <div id="my-container"> + <div v-if="isclear" :id="id" ref="button" variant="primary" class="pointer"> + <img src="@/assets/images/clear-icon.svg" /> + <span class="regular-12px red-font">{{ $t(description) }}</span> + </div> + <div + v-else-if="isMicrocode" + :id="id" + ref="button" + variant="primary" + class="pointer" + > + <img src="@/assets/images/icon-reload-red.svg" /> + <span class="regular-12px red-font">{{ $t(description) }}</span> + </div> + <span - v-if="!microcode" + v-else :id="id" ref="button" class="regular-12px underline pointer" @@ -9,13 +24,6 @@ > {{ $t(description) }} </span> - <div v-else :id="id" ref="button" variant="primary" class="pointer"> - <img src="@/assets/images/icon-reload-red.svg" /> - <span class="regular-12px microcode-reload-font">{{ - $t(description) - }}</span> - </div> - <!-- Our popover title and content render container --> <b-popover ref="popover" @@ -92,7 +100,11 @@ export default { type: String, default: '', }, - microcode: { + isMicrocode: { + type: Boolean, + default: false, + }, + isclear: { type: Boolean, default: false, }, @@ -198,9 +210,6 @@ export default { .form-control { width: 341px; height: 52px; - background: rgba(26, 62, 91, 0.05); - border-radius: 8px; - border: none; margin: -25px auto; padding-top: 30px; } @@ -211,7 +220,7 @@ export default { display: flex; justify-content: center; align-items: center; - background: rgba(26, 62, 91, 0.05); + background: $faint-secondary-primary-5; border-radius: 8px; border: none; margin: 0 auto; @@ -241,7 +250,10 @@ export default { } .popover-info { - background-color: #040a0f; + background-color: $on-surface-primary; + // border: 1px solid $text-primary; + // box-shadow: 0px 6px 16px -12px rgba(23, 40, 77, 0.06); + border-radius: 8px; width: 168px; height: 76px; &.arrow { @@ -249,7 +261,7 @@ export default { } } -.microcode-reload-font { +.red-font { padding-left: 5px; color: $red-brand-primary; } |