UNPKG

vue-simple-context-menu

Version:

Simple context-menu component built for Vue. Works well with both left and right clicks. Nothing too fancy, just works and is simple to use.

2 lines (1 loc) 1.66 kB
@import"https://fonts.googleapis.com/css?family=Muli:400,700";html{width:100%;font-size:18px;color:#333}body{margin:0;height:100%;height:100vh;width:100%;font-family:Muli,sans-serif}#app{height:100%;height:100vh;width:100%;line-height:1.5}.code-text{background:#eee;border:1px solid #ddd;padding:10px 20px;border-radius:4px;margin-bottom:20px;text-align:center}@media (min-width: 992px){.code-text{margin-bottom:0}}.btn{text-transform:uppercase;font-weight:700}textarea{min-height:175px}.github-corner:hover .octo-arm{animation:octocat-wave .56s ease-in-out}@keyframes octocat-wave{0%,to{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width: 500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave .56s ease-in-out}}.vue-simple-context-menu{background-color:#ecf0f1;border-bottom-width:0px;border-radius:4px;box-shadow:0 3px 6px #3333;display:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;left:0;list-style:none;margin:0;padding:0;position:absolute;top:0;z-index:1000000}.vue-simple-context-menu--active{display:block}.vue-simple-context-menu__item{align-items:center;color:#333;cursor:pointer;display:flex;padding:5px 15px}.vue-simple-context-menu__item:hover{background-color:#007aff;color:#fff}.vue-simple-context-menu__divider{background-clip:content-box;background-color:#c0cdd1;box-sizing:content-box;height:2px;padding:4px 0;pointer-events:none}.vue-simple-context-menu li:first-of-type{margin-top:4px}.vue-simple-context-menu li:last-of-type{margin-bottom:4px}