context-menu.css

/**
 * @author Chris Board - Boardies IT Solutons
 * @description Creates a 3-dot context menu on tables, <p> tags and heading tags (e.g. h1, h2 etc).
 * @copyright (c) Boardies IT Solutions - December 2017
 */

.context-menu, td.context-menu, p.context-menu, h1.context-menu, h2.context-menu, h3.context-menu, h4.context-menu, h5.context-menu
{
    cursor: pointer;
    pointer-events: none;

}
.context-menu:after
{
    content: '\2807';
    font-size: 20px;
    cursor: pointer;
    cursor: hand;
    pointer-events: all ;
}

td.context-menu:after
{
    float: right;
}

p.contextMenu:after > span
{
    margin: 0 !important;
    padding: 0 !important;
}

h1.context-menu:after,h2.context-menu:after,h3.context-menu:after,h4.context-menu:after,h5.context-menu:after
{
    margin-left: 30px;
}

.context-menu-container
{
    background-color: white;
    z-index: 1000 !important;
    border-radius: 5px;
    position: absolute;
    display: none;
    border: solid thin black;
    padding: 3px;
    -webkit-box-shadow: 4px 4px 8px 0px rgba(0,0,0,0.18);
    -moz-box-shadow: 4px 4px 8px 0px rgba(0,0,0,0.18);
    box-shadow: 4px 4px 8px 0px rgba(0,0,0,0.18);
    min-width: 90px;
}

.context-menu-container > ul
{
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.context-menu-container > ul > li
{
    padding: 5px;
    cursor: hand;
    cursor: pointer;
    border-radius: 5px;
}

.context-menu-container > ul > li.disabled
{
    color: #b7b7b7;
}

.context-menu-container > ul > li.disabled:hover
{
    background-color: white;
}

.context-menu-container > ul > li:hover
{
    background-color: #c4c4c4;
}

.context-menu-container > ul > li.danger:hover
{
    background-color: #ff6959;
}

.context-menu-container > ul > li.warning:hover
{
    background-color: #fff27c;
}

.context-menu-container > ul > li.danger.disabled:hover, .context-menu-container > ul > li.warning.disabled:hover
{
    background-color: white;
}