prism-toolbar.css 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. div.code-toolbar {
  2. position: relative;
  3. }
  4. div.code-toolbar > .toolbar {
  5. position: absolute;
  6. top: .3em;
  7. right: .2em;
  8. transition: opacity 0.3s ease-in-out;
  9. opacity: 0;
  10. }
  11. div.code-toolbar:hover > .toolbar {
  12. opacity: 1;
  13. }
  14. /* Separate line b/c rules are thrown out if selector is invalid.
  15. IE11 and old Edge versions don't support :focus-within. */
  16. div.code-toolbar:focus-within > .toolbar {
  17. opacity: 1;
  18. }
  19. div.code-toolbar > .toolbar .toolbar-item {
  20. display: inline-block;
  21. }
  22. div.code-toolbar > .toolbar a {
  23. cursor: pointer;
  24. }
  25. div.code-toolbar > .toolbar button {
  26. background: none;
  27. border: 0;
  28. color: inherit;
  29. font: inherit;
  30. line-height: normal;
  31. overflow: visible;
  32. padding: 0;
  33. -webkit-user-select: none; /* for button */
  34. -moz-user-select: none;
  35. -ms-user-select: none;
  36. }
  37. div.code-toolbar > .toolbar a,
  38. div.code-toolbar > .toolbar button,
  39. div.code-toolbar > .toolbar span {
  40. color: #bbb;
  41. font-size: .8em;
  42. padding: 0 .5em;
  43. background: #f5f2f0;
  44. background: rgba(224, 224, 224, 0.2);
  45. box-shadow: 0 2px 0 0 rgba(0,0,0,0.2);
  46. border-radius: .5em;
  47. }
  48. div.code-toolbar > .toolbar a:hover,
  49. div.code-toolbar > .toolbar a:focus,
  50. div.code-toolbar > .toolbar button:hover,
  51. div.code-toolbar > .toolbar button:focus,
  52. div.code-toolbar > .toolbar span:hover,
  53. div.code-toolbar > .toolbar span:focus {
  54. color: inherit;
  55. text-decoration: none;
  56. }