main.scss 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. .insp-wrapper {
  2. // Import variables, color and font files
  3. @import "defines";
  4. // Style for resize bar
  5. .gutter {
  6. background-color: $background-lighter;
  7. &.gutter-vertical:not(.blocked) {
  8. cursor : ns-resize;
  9. }
  10. &.gutter-horizontal:not(.blocked) {
  11. cursor : ew-resize;
  12. }
  13. }
  14. user-select: none;
  15. display:flex;
  16. font-size:0.9em;
  17. font-family : $font;
  18. background-color: $background;
  19. // The panel containing the two subpanel : tree and details
  20. .insp-right-panel {
  21. width: 750px;
  22. overflow-y: auto;
  23. &.popupmode {
  24. width:100% !important;
  25. }
  26. display:flex;
  27. flex-direction: column;
  28. flex-shrink: 0;
  29. // The tree panel
  30. .top-panel {
  31. width:100%;
  32. height:100%;
  33. position:relative;
  34. background-color: $background;
  35. color : $color;
  36. font-size : 1em;
  37. // The div that will contain the tab div
  38. .tab-panel-content {
  39. width:100%;
  40. height:calc(100% - #{$tabbar-height});
  41. }
  42. // The div displaying all invisible tabs (when the tabbar width is small)
  43. .more-tabs-panel {
  44. position:absolute;
  45. z-index:10;
  46. top:$tabbar-height;
  47. right:0;
  48. width:100px;
  49. display:none;
  50. flex-direction: column;
  51. align-items: center;
  52. justify-content: center;
  53. border: 1px solid $background-lighter3;
  54. background-color: $background;
  55. .invisible-tab {
  56. height : 25px;
  57. width : 100%;
  58. line-height: 25px;
  59. text-align : center;
  60. background-color: $background-lighter;
  61. cursor:pointer;
  62. // Hover on it
  63. &:hover {
  64. background-color: $background-lighter2;
  65. }
  66. // Clic on it
  67. &:active {
  68. background-color: $background-lighter3;
  69. }
  70. }
  71. }
  72. }
  73. }
  74. @import 'tooltip';
  75. // All tools used on object in the tree
  76. @import 'treeTool';
  77. @import "tabPanel";
  78. @import "tabs/shaderTab";
  79. @import "tabs/consoleTab";
  80. @import "tabs/statsTab";
  81. @import "tree";
  82. @import "detailPanel";
  83. @import "tabbar";
  84. @import "toolbar";
  85. @import "searchbar";
  86. }