shortcut.theme.css 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. /**
  2. * @file
  3. * Styling for the shortcut module.
  4. */
  5. /**
  6. * Toolbar.
  7. */
  8. .toolbar .toolbar-tray-vertical .edit-shortcuts {
  9. text-align: left; /* LTR */
  10. padding: 20px 25px;
  11. border-bottom: 1px solid #0e4f8a;
  12. }
  13. [dir="rtl"] .toolbar .toolbar-tray-vertical .edit-shortcuts {
  14. text-align: right;
  15. }
  16. .toolbar .toolbar-tray-horizontal .edit-shortcuts {
  17. float: right; /* LTR */
  18. }
  19. [dir="rtl"] .toolbar .toolbar-tray-horizontal .edit-shortcuts {
  20. float: left;
  21. }
  22. /**
  23. * Add/remove links.
  24. */
  25. .shortcut-action {
  26. display: inline-block;
  27. margin-left: 0.3em; /* LTR */
  28. }
  29. [dir="rtl"] .shortcut-action {
  30. margin-left: 0;
  31. margin-right: 0.3em;
  32. }
  33. .shortcut-action__message {
  34. background: #000;
  35. background: rgba(0, 0, 0, 0.5);
  36. border-radius: 5px;
  37. padding: 0 5px;
  38. color: #fff;
  39. display: inline-block;
  40. margin-left: 0.3em; /* LTR */
  41. opacity: 0;
  42. -ms-transform: translateY(-12px);
  43. -webkit-transform: translateY(-12px);
  44. transform: translateY(-12px);
  45. -webkit-transition: all 200ms ease-out;
  46. transition: all 200ms ease-out;
  47. -ms-backface-visibility: hidden;
  48. -webkit-backface-visibility: hidden;
  49. backface-visibility: hidden;
  50. }
  51. [dir="rtl"] .shortcut-action__message {
  52. margin-left: 0;
  53. margin-right: 0.3em;
  54. }
  55. .shortcut-action:hover .shortcut-action__message,
  56. .shortcut-action:focus .shortcut-action__message {
  57. opacity: 1;
  58. -ms-transform: translateY(-2px);
  59. -webkit-transform: translateY(-2px);
  60. transform: translateY(-2px);
  61. }