Unverified Commit 9642215b authored by Laila Los's avatar Laila Los
Browse files

make link visible on focus

parent cda55bdb

client/src/components/Panels/Common/ToolPanelLabel.vue

+7 −3
Original line number Diff line number Diff line 
<template>

    <div v-b-tooltip.topright.hover class="tool-panel-label" :title="description">

    <div v-b-tooltip.topright.hover class="tool-panel-label" tabindex="0" :title="description">

        {{ definition.text }}

        <ToolPanelLinks :links="definition.links" />

    </div>
@@ -30,8 +30,12 @@ export default { 
        display: none;

    }



    &:hover:deep(.tool-panel-links) {

    &:hover,

    &:focus,

    &:focus-within {

        &:deep(.tool-panel-links) {

            display: inline;

        }

    }

}

</style>

client/src/components/Panels/Common/ToolSection.vue

+8 −8
Original line number Diff line number Diff line
@@ -3,16 +3,12 @@ 
        <div

            v-b-tooltip.topright.hover

            :class="['toolSectionTitle', `tool-menu-section-${sectionName}`]"

            :title="title"

            @mouseover="hover = true"

            @mouseleave="hover = false"

            @focus="hover = true"

            @blur="hover = false">

            :title="title">

            <a class="title-link" href="javascript:void(0)" @click="toggleMenu()">

                <span class="name">

                    {{ name }}

                </span>

                <ToolPanelLinks :links="links" :show="hover" />

                <ToolPanelLinks :links="links" />

            </a>

        </div>

        <transition name="slide">
@@ -262,8 +258,12 @@ export default { 
        display: none;

    }



    &:hover:deep(.tool-panel-links) {

    &:hover,

    &:focus,

    &:focus-within {

        &:deep(.tool-panel-links) {

            display: inline;

        }

    }

}

</style>