_code_editor.scss 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. .gf-code-editor {
  2. min-height: 2.60rem;
  3. min-width: 20rem;
  4. flex-grow: 1;
  5. margin-right: 0.25rem;
  6. border: 1px solid #333333;
  7. &.ace_editor {
  8. min-height: 2.60rem;
  9. font-family: monospace;
  10. font-size: 1rem;
  11. }
  12. }
  13. .ace_editor.ace_autocomplete {
  14. // Ace editor adds <style> tag at the end of <head>, after grafana.css, so !important
  15. // is used for overriding styles with the same CSS specificity.
  16. background-color: $dropdownBackground !important;
  17. color: $dropdownLinkColor !important;
  18. border: 1px solid $dropdownBorder !important;
  19. font-family: monospace;
  20. font-size: 1rem;
  21. .ace_scroller {
  22. .ace_selected, .ace_active-line, .ace_line-hover {
  23. color: $dropdownLinkColorHover;
  24. background-color: $dropdownLinkBackgroundHover !important;
  25. }
  26. .ace_line-hover {
  27. border-color: transparent;
  28. }
  29. .ace_completion-highlight {
  30. color: $yellow;
  31. }
  32. .ace_rightAlignedText {
  33. color: $text-muted;
  34. z-index: 0;
  35. }
  36. }
  37. }
  38. .ace_tooltip.ace_doc-tooltip {
  39. background-color: $dropdownBackground;
  40. background-image: none;
  41. color: $dropdownLinkColor;
  42. border: 1px solid $dropdownBorder;
  43. font-family: monospace;
  44. font-size: 1rem;
  45. hr {
  46. background-color: $dropdownDividerBottom;
  47. }
  48. }