mirror of
https://github.com/Ocelot-Social-Community/Ocelot-Social.git
synced 2025-12-13 07:46:06 +00:00
style suggestion lists
This commit is contained in:
parent
d28864ab73
commit
10e11a4e9b
@ -25,7 +25,7 @@ export default {
|
|||||||
interactive: true,
|
interactive: true,
|
||||||
placement,
|
placement,
|
||||||
showOnInit,
|
showOnInit,
|
||||||
theme: 'dark',
|
theme: 'human-connection',
|
||||||
trigger,
|
trigger,
|
||||||
onMount(instance) {
|
onMount(instance) {
|
||||||
const input = instance.popper.querySelector('input')
|
const input = instance.popper.querySelector('input')
|
||||||
@ -65,31 +65,31 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.tippy-tooltip.dark-theme {
|
.tippy-tooltip.human-connection-theme {
|
||||||
background-color: $color-neutral-0;
|
background-color: $color-primary;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
text-align: inherit;
|
text-align: inherit;
|
||||||
color: $color-neutral-100;
|
color: $color-neutral-100;
|
||||||
border-radius: 5px;
|
|
||||||
.tippy-backdrop {
|
.tippy-backdrop {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tippy-roundarrow {
|
.tippy-roundarrow {
|
||||||
fill: $color-neutral-0;
|
fill: $color-primary;
|
||||||
}
|
}
|
||||||
.tippy-popper[x-placement^='top'] & .tippy-arrow {
|
.tippy-popper[x-placement^='top'] & .tippy-arrow {
|
||||||
border-top-color: $color-neutral-0;
|
border-top-color: $color-primary;
|
||||||
}
|
}
|
||||||
.tippy-popper[x-placement^='bottom'] & .tippy-arrow {
|
.tippy-popper[x-placement^='bottom'] & .tippy-arrow {
|
||||||
border-bottom-color: $color-neutral-0;
|
border-bottom-color: $color-primary;
|
||||||
}
|
}
|
||||||
.tippy-popper[x-placement^='left'] & .tippy-arrow {
|
.tippy-popper[x-placement^='left'] & .tippy-arrow {
|
||||||
border-left-color: $color-neutral-0;
|
border-left-color: $color-primary;
|
||||||
}
|
}
|
||||||
.tippy-popper[x-placement^='right'] & .tippy-arrow {
|
.tippy-popper[x-placement^='right'] & .tippy-arrow {
|
||||||
border-right-color: $color-neutral-0;
|
border-right-color: $color-primary;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -67,7 +67,8 @@ export default {
|
|||||||
.suggestion-list {
|
.suggestion-list {
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
padding: 0.2rem;
|
padding: 0.2rem;
|
||||||
border: 2px solid rgba($color-neutral-0, 0.1);
|
border-radius: 5px;
|
||||||
|
border: 2px solid $color-primary;
|
||||||
font-size: 0.8rem;
|
font-size: 0.8rem;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
@ -84,11 +85,11 @@ export default {
|
|||||||
|
|
||||||
&.is-selected,
|
&.is-selected,
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: rgba($color-neutral-100, 0.2);
|
background-color: rgba($color-neutral-100, 0.3);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.hint {
|
&.hint {
|
||||||
opacity: 0.5;
|
opacity: 0.7;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user