diff --git a/frontend/src/LangSelect.vue b/frontend/src/LangSelect.vue index f844774..6c0ba28 100644 --- a/frontend/src/LangSelect.vue +++ b/frontend/src/LangSelect.vue @@ -13,10 +13,22 @@ const props = defineProps({ const emit = defineEmits(['update:modelValue']) const open = ref(false) +const toggleBtn = ref(null) +const popStyle = ref({}) const current = computed( () => props.options.find((o) => o.tag === props.modelValue) ?? props.options[0], ) +function toggle() { + open.value = !open.value + if (open.value) { + // Position: fixed so the popup overflows the scrolling editor panel + // onto the page area instead of being clipped by it. + const r = toggleBtn.value.getBoundingClientRect() + popStyle.value = { top: `${r.bottom + 2}px`, left: `${r.left}px` } + } +} + function select(tag) { emit('update:modelValue', tag) open.value = false @@ -26,15 +38,16 @@ function select(tag) {