grafana-responsive.less 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. @import "responsive.less";
  2. @gridColumnWidth: 70px;
  3. @gridGutterWidth: 10px;
  4. @gridColumnWidth768: 52px;
  5. @gridGutterWidth768: 10px;
  6. @gridColumnWidth1200: 90px;
  7. @gridGutterWidth1200: 10px;
  8. // Fluid grid
  9. // -------------------------
  10. @fluidGridColumnWidth: percentage(@gridColumnWidth/@gridRowWidth);
  11. @fluidGridGutterWidth: percentage(@gridGutterWidth/@gridRowWidth);
  12. // 1200px min
  13. @fluidGridColumnWidth1200: percentage(@gridColumnWidth1200/@gridRowWidth1200);
  14. @fluidGridGutterWidth1200: percentage(@gridGutterWidth1200/@gridRowWidth1200);
  15. // 768px-979px
  16. @fluidGridColumnWidth768: percentage(@gridColumnWidth768/@gridRowWidth768);
  17. @fluidGridGutterWidth768: percentage(@gridGutterWidth768/@gridRowWidth768);
  18. // Media queries
  19. // ---------------------
  20. @media (max-width: 767px) {
  21. div.panel {
  22. width: 100% !important;
  23. padding: 0px !important;
  24. }
  25. body {
  26. padding: 0;
  27. }
  28. }
  29. .back-to-dashboard-link {
  30. display: none;
  31. }
  32. @media (min-width: 990px) {
  33. .back-to-dashboard-link {
  34. display: block;
  35. }
  36. .sidemenu-open {
  37. .back-to-dashboard-link {
  38. display: none;
  39. }
  40. }
  41. }
  42. @media (min-width: 1210px) {
  43. .back-to-dashboard-link {
  44. display: block;
  45. }
  46. }