svgedit/src/editor/dialogs/cmenuLayersDialog.html

Powerful SVG-Editor for your browser

<style>
    .contextMenu {
        position: absolute;
        z-index: 99999;
        border: solid 1px rgba(0, 0, 0, .33);
        background: rgba(255, 255, 255, .95);
        padding: 5px 0;
        margin: 0px;
        display: none;
        font: 12px/15px Lucida Sans, Helvetica, Verdana, sans-serif;
        border-radius: 5px;
        -moz-border-radius: 5px;
        -moz-box-shadow: 2px 5px 10px rgba(0, 0, 0, .3);
        -webkit-box-shadow: 2px 5px 10px rgba(0, 0, 0, .3);
        box-shadow: 2px 5px 10px rgba(0, 0, 0, .3);
    }

    .contextMenu li {
        list-style: none;
        padding: 0px;
        margin: 0px;
    }

    .contextMenu .shortcut {
        width: 115px;
        text-align: right;
        float: right;
    }

    .contextMenu a {
        -moz-user-select: none;
        -webkit-user-select: none;
        user-select: none;
        color: #222;
        text-decoration: none;
        display: block;
        line-height: 20px;
        height: 20px;
        background-position: 6px center;
        background-repeat: no-repeat;
        outline: none;
        padding: 0px 15px 1px 20px;
    }

    .contextMenu li.hover a {
        background-color: #2e5dea;
        color: white;
        cursor: default;
    }

    .contextMenu li.disabled a {
        color: #999;
        pointer-events: none;
    }

    .contextMenu li.hover.disabled a {
        background-color: transparent;
    }

    .contextMenu li.separator {
        border-top: solid 1px #E3E3E3;
        padding-top: 5px;
        margin-top: 5px;
    }
</style>
<ul id="cmenu_layers" class="contextMenu">
    <li><a href="#dupe" id="se-dupe">#{svgEditor.i18next.t('layers.dupe')}</a></li>
    <li><a href="#delete" id="se-layer-delete">#{svgEditor.i18next.t('layers.del')}</a></li>
    <li><a href="#merge_down" id="se-merge-down">#{svgEditor.i18next.t('layers.merge_down')}</a></li>
    <li><a href="#merge_all" id="se-merge-all">#{svgEditor.i18next.t('layers.merge_all')}</a></li>
</ul>