_old_responsive.scss 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. .dashnav-back-to-dashboard {
  2. display: none;
  3. }
  4. // Media queries
  5. // ---------------------
  6. @include media-breakpoint-down(sm) {
  7. div.panel {
  8. width: 100% !important;
  9. padding: 0px !important;
  10. }
  11. .panel-margin {
  12. margin-right: 0;
  13. margin-left: 0;
  14. }
  15. body {
  16. padding: 0;
  17. }
  18. .page-dashboard .navbar-page-btn {
  19. max-width: 200px;
  20. }
  21. .gf-timepicker-nav-btn {
  22. max-width: 120px;
  23. }
  24. .dashnav-zoom-out,
  25. .dashnav-move-timeframe,
  26. .dashnav-action-icons {
  27. display: none;
  28. }
  29. .page-container {
  30. padding: ($spacer * 1) ($spacer * 2);
  31. }
  32. }
  33. @include media-breakpoint-down(xs) {
  34. .page-dashboard .navbar-page-btn {
  35. max-width: 150px;
  36. }
  37. }
  38. // form styles
  39. @include media-breakpoint-up(md) {
  40. .page-dashboard .navbar-page-btn {
  41. max-width: 180px;
  42. }
  43. .gf-timepicker-nav-btn {
  44. max-width: 120px;
  45. }
  46. .dashnav-move-timeframe {
  47. display: none;
  48. }
  49. .panel-in-fullscreen {
  50. .dashnav-action-icons {
  51. display: none;
  52. }
  53. .dashnav-back-to-dashboard {
  54. display: block;
  55. }
  56. }
  57. }
  58. @include media-breakpoint-up(lg) {
  59. .page-dashboard .navbar-page-btn {
  60. max-width: 290px;
  61. }
  62. .gf-timepicker-nav-btn {
  63. max-width: 240px;
  64. }
  65. .dashnav-zoom-out {
  66. display: block;
  67. }
  68. .dashnav-move-timeframe {
  69. display: block;
  70. }
  71. }
  72. @include media-breakpoint-up(xl) {
  73. .panel-in-fullscreen {
  74. .dashnav-action-icons {
  75. display: block;
  76. }
  77. }
  78. .page-dashboard .navbar-page-btn {
  79. max-width: none;
  80. }
  81. .gf-timepicker-nav-btn {
  82. max-width: none;
  83. }
  84. }