_editor-overlay.scss 789 B

12345678910111213141516171819202122232425262728293031323334353637
  1. @mixin overlay-processing-style($additionalSelector, $contentFontSize: inherit, $contentPadding: inherit) {
  2. .overlay.#{$additionalSelector} {
  3. background: rgba(255,255,255,0.5);
  4. .overlay-content {
  5. background: rgba(200,200,200,0.5);
  6. color: #444;
  7. font-size: $contentFontSize;
  8. padding: $contentPadding;
  9. }
  10. }
  11. }
  12. // overlay in .editor-container
  13. .editor-container {
  14. .overlay {
  15. // layout
  16. display: flex;
  17. justify-content: center;
  18. align-items: center;
  19. position: absolute;
  20. z-index: 7; // forward than .CodeMirror-vscrollbar
  21. top: 0;
  22. right: 0;
  23. bottom: 0;
  24. left: 0;
  25. .overlay-content {
  26. padding: 0.5em;
  27. }
  28. }
  29. // loading keymap
  30. @include overlay-processing-style(overlay-loading-keymap, 2.5em, 0.3em);
  31. }