main.scss 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  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. &.popupmode {
  23. width:100% !important;
  24. }
  25. display:flex;
  26. flex-direction: column;
  27. flex-shrink: 0;
  28. // The tree panel
  29. .top-panel {
  30. width:100%;
  31. height:100%;
  32. position:relative;
  33. background-color: $background;
  34. color : $color;
  35. font-size : 1em;
  36. // The div that will contain the tab div
  37. .tab-panel-content {
  38. width:100%;
  39. height:calc(100% - #{$tabbar-height});
  40. }
  41. // The div displaying all invisible tabs (when the tabbar width is small)
  42. .more-tabs-panel {
  43. position:absolute;
  44. z-index:10;
  45. top:$tabbar-height;
  46. right:0;
  47. width:100px;
  48. display:none;
  49. flex-direction: column;
  50. align-items: center;
  51. justify-content: center;
  52. border: 1px solid $background-lighter3;
  53. background-color: $background;
  54. .invisible-tab {
  55. height : 25px;
  56. width : 100%;
  57. line-height: 25px;
  58. text-align : center;
  59. background-color: $background-lighter;
  60. cursor:pointer;
  61. // Hover on it
  62. &:hover {
  63. background-color: $background-lighter2;
  64. }
  65. // Clic on it
  66. &:active {
  67. background-color: $background-lighter3;
  68. }
  69. }
  70. }
  71. }
  72. }
  73. @import 'tooltip';
  74. // All tools used on object in the tree
  75. @import 'treeTool';
  76. @import "tabPanel";
  77. @import "tabs/shaderTab";
  78. @import "tabs/consoleTab";
  79. @import "tabs/statsTab";
  80. @import "tree";
  81. @import "detailPanel";
  82. @import "tabbar";
  83. @import "toolbar";
  84. @import "searchbar";
  85. }