<div class="context-menu context-menu--is-hidden">
    <button class="btn btn-simple context-menu__button  btn-icon-only " type="button">
				<span class="btn__inner">
					<span class="btn__icon-wrapper">
						<?xml version="1.0" encoding="utf-8"?>
						<svg
							class='btn__icon '
							version="1.1"
							id="Layer_1"
							xmlns="http://www.w3.org/2000/svg"
							xmlns:xlink="http://www.w3.org/1999/xlink"
							x="0px"
							y="0px"
							width="24px"
							height="24px"
							viewBox="0 0 24 24"
							enable-background="new 0 0 24 24"
							xml:space="preserve">
						<path fill-rule="evenodd" fill="none" clip-rule="evenodd" d="M3.375 14.648C4.82475 14.648 6 13.4727 6 12.023C6 10.5732 4.82475 9.39799 3.375 9.39799C1.92525 9.39799 0.75 10.5732 0.75 12.023C0.75 13.4727 1.92525 14.648 3.375 14.648Z"  stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" fill="none" clip-rule="evenodd" d="M20.625 14.648C22.0747 14.648 23.25 13.4727 23.25 12.023C23.25 10.5732 22.0747 9.39799 20.625 9.39799C19.1753 9.39799 18 10.5732 18 12.023C18 13.4727 19.1753 14.648 20.625 14.648Z"  stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" fill="none" clip-rule="evenodd" d="M12 14.648C13.4497 14.648 14.625 13.4727 14.625 12.023C14.625 10.5732 13.4497 9.39799 12 9.39799C10.5503 9.39799 9.375 10.5732 9.375 12.023C9.375 13.4727 10.5503 14.648 12 14.648Z"  stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
						</svg>
					</span>
					
				</span>	
		</button>
    <div class="context-menu__menu context-menu__menu-left">
        <ul class="button-group button-group-floating">
            <li class="button-group__item">
                <button class="btn btn-simple btn-full-width " type="button">
							<span class="btn__inner">
									<span class="btn__text">Edit Service</span>
								
							</span>	
					</button>
            </li>
            <li class="button-group__item">
                <button class="btn btn-simple btn-full-width " type="button">
							<span class="btn__inner">
									<span class="btn__text">Hide Service</span>
								
							</span>	
					</button>
            </li>
            <li class="button-group__item">
                <button class="btn btn-simple btn-full-width " type="button">
							<span class="btn__inner">
									<span class="btn__text">Move to Category</span>
								
							</span>	
					</button>
            </li>
        </ul>
    </div>
</div>
<div class="context-menu context-menu--is-hidden">
	{{#if isSmall}}
		{{> @button className="btn-simple btn-small context-menu__button" icon='<path fill-rule="evenodd" fill="none" clip-rule="evenodd" d="M3.375 14.648C4.82475 14.648 6 13.4727 6 12.023C6 10.5732 4.82475 9.39799 3.375 9.39799C1.92525 9.39799 0.75 10.5732 0.75 12.023C0.75 13.4727 1.92525 14.648 3.375 14.648Z"  stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" fill="none" clip-rule="evenodd" d="M20.625 14.648C22.0747 14.648 23.25 13.4727 23.25 12.023C23.25 10.5732 22.0747 9.39799 20.625 9.39799C19.1753 9.39799 18 10.5732 18 12.023C18 13.4727 19.1753 14.648 20.625 14.648Z"  stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" fill="none" clip-rule="evenodd" d="M12 14.648C13.4497 14.648 14.625 13.4727 14.625 12.023C14.625 10.5732 13.4497 9.39799 12 9.39799C10.5503 9.39799 9.375 10.5732 9.375 12.023C9.375 13.4727 10.5503 14.648 12 14.648Z"  stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>'}}
	{{else}}
		{{> @button className="btn-simple context-menu__button" icon='<path fill-rule="evenodd" fill="none" clip-rule="evenodd" d="M3.375 14.648C4.82475 14.648 6 13.4727 6 12.023C6 10.5732 4.82475 9.39799 3.375 9.39799C1.92525 9.39799 0.75 10.5732 0.75 12.023C0.75 13.4727 1.92525 14.648 3.375 14.648Z"  stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" fill="none" clip-rule="evenodd" d="M20.625 14.648C22.0747 14.648 23.25 13.4727 23.25 12.023C23.25 10.5732 22.0747 9.39799 20.625 9.39799C19.1753 9.39799 18 10.5732 18 12.023C18 13.4727 19.1753 14.648 20.625 14.648Z"  stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" fill="none" clip-rule="evenodd" d="M12 14.648C13.4497 14.648 14.625 13.4727 14.625 12.023C14.625 10.5732 13.4497 9.39799 12 9.39799C10.5503 9.39799 9.375 10.5732 9.375 12.023C9.375 13.4727 10.5503 14.648 12 14.648Z"  stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>'}}
	{{/if}}
	<div class="context-menu__menu{{#if leftAlign}} context-menu__menu-left{{/if}}">
		{{> @button-group isFloating=true}}
	</div>
</div>
{
  "leftAlign": true,
  "actions": [
    {
      "text": "Edit Service",
      "className": "btn-simple btn-full-width"
    },
    {
      "text": "Hide Service",
      "className": "btn-simple btn-full-width"
    },
    {
      "text": "Move to Category",
      "className": "btn-simple btn-full-width"
    }
  ]
}

Context Menu

A Context Menu may be used to truncate multiple related, non-primary actions. This is especially useful for entities to which Skills add actions.