index.css 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175
  1. /*-----------------------------------------------------------------------------
  2. | Variables
  3. |----------------------------------------------------------------------------*/
  4. :root {
  5. --jp-private-running-button-height: 28px;
  6. --jp-private-running-button-width: 48px;
  7. --jp-private-running-item-height: 24px;
  8. --jp-private-running-shutdown-button-height: 24px;
  9. }
  10. /*-----------------------------------------------------------------------------
  11. | Copyright (c) Jupyter Development Team.
  12. | Distributed under the terms of the Modified BSD License.
  13. |----------------------------------------------------------------------------*/
  14. .jp-RunningSessions {
  15. display: flex;
  16. flex-direction: column;
  17. min-width: var(--jp-sidebar-min-width);
  18. color: var(--jp-ui-font-color1);
  19. background: var(--jp-layout-color1);
  20. /* This is needed so that all font sizing of children done in ems is
  21. * relative to this base size */
  22. font-size: var(--jp-ui-font-size1);
  23. }
  24. .jp-RunningSessions-header {
  25. flex: 0 0 auto;
  26. display: flex;
  27. flex-direction: row;
  28. margin: var(--jp-toolbar-header-margin);
  29. justify-content: flex-end;
  30. }
  31. .jp-RunningSessions-header .jp-ToolbarButtonComponent {
  32. padding: 0px 16px;
  33. }
  34. .jp-RunningSessions-shutdownAll {
  35. flex: 1 1 auto;
  36. height: var(--jp-private-running-button-height);
  37. width: var(--jp-private-running-button-width);
  38. max-width: 100px;
  39. min-width: 16px;
  40. min-height: 16px;
  41. padding: 4px 6px;
  42. background: var(--jp-layout-color1);
  43. border: none;
  44. outline: 0;
  45. background-image: var(--jp-icon-close);
  46. background-size: 16px;
  47. vertical-align: middle;
  48. background-repeat: no-repeat;
  49. background-position: center;
  50. }
  51. .jp-RunningSessions-section {
  52. display: flex;
  53. flex: 0 1 auto;
  54. flex-direction: column;
  55. overflow: auto;
  56. }
  57. .jp-RunningSessions-sectionHeader {
  58. flex: 0 0 auto;
  59. align-items: center;
  60. height: 28px;
  61. display: flex;
  62. border-bottom: var(--jp-border-width) solid var(--jp-border-color2);
  63. margin-top: 8px;
  64. }
  65. .jp-RunningSessions-sectionHeader h2 {
  66. flex: 0 0 auto;
  67. font-weight: 600;
  68. text-transform: uppercase;
  69. letter-spacing: 1px;
  70. font-size: var(--jp-ui-font-size0);
  71. padding: 8px 8px 8px 12px;
  72. margin: 0px;
  73. }
  74. .jp-RunningSessions-sectionHeader .jp-ToolbarButtonComponent {
  75. flex: 0 0 auto;
  76. }
  77. .jp-RunningSessions-sectionContainer {
  78. flex: 1 1 auto;
  79. margin: 0;
  80. padding: 0;
  81. overflow: auto;
  82. }
  83. .jp-RunningSessions-sectionList {
  84. margin: 0;
  85. padding: 0;
  86. list-style-type: none;
  87. }
  88. .jp-RunningSessions-item {
  89. display: flex;
  90. flex-direction: row;
  91. color: var(--jp-ui-font-color1);
  92. height: var(--jp-private-running-item-height);
  93. line-height: var(--jp-private-running-item-height);
  94. }
  95. .jp-RunningSessions-itemIcon {
  96. flex: 0 0 auto;
  97. padding: 0px 8px;
  98. margin-right: 4px;
  99. margin-left: 12px;
  100. vertical-align: baseline;
  101. background-size: 16px;
  102. background-repeat: no-repeat;
  103. background-position: center;
  104. }
  105. .jp-RunningSessions-itemIcon.jp-mod-notebook {
  106. background-image: var(--jp-icon-book);
  107. }
  108. .jp-RunningSessions-itemIcon.jp-mod-console {
  109. background-image: var(--jp-icon-console);
  110. }
  111. .jp-RunningSessions-itemIcon.jp-mod-file:before {
  112. background-image: var(--jp-icon-file);
  113. }
  114. .jp-RunningSessions-itemIcon.jp-mod-terminal {
  115. background-image: var(--jp-icon-terminal);
  116. }
  117. .jp-RunningSessions-itemLabel {
  118. font-size: var(--jp-ui-font-size1);
  119. flex: 1 1 auto;
  120. margin-right: 4px;
  121. padding-left: 4px;
  122. text-overflow: ellipsis;
  123. overflow: hidden;
  124. white-space: nowrap;
  125. border-radius: 2px;
  126. transition: background-color 0.1s ease;
  127. }
  128. .jp-RunningSessions-itemLabel:hover {
  129. background-color: var(--jp-layout-color2);
  130. }
  131. .jp-RunningSessions-itemLabel:focus {
  132. background-color: rgba(153, 153, 153, 0.2);
  133. }
  134. .jp-RunningSessions-itemShutdown.jp-mod-styled {
  135. margin: 0px 4px;
  136. color: var(--jp-warn-color1);
  137. font-weight: 500;
  138. background-color: transparent;
  139. height: var(--jp-private-running-shutdown-button-height);
  140. line-height: var(--jp-private-running-shutdown-button-height);
  141. transition: background-color 0.1s ease;
  142. border-radius: 2px;
  143. }
  144. .jp-RunningSessions-itemShutdown.jp-mod-styled:hover {
  145. background-color: rgba(153, 153, 153, 0.1);
  146. }
  147. .jp-RunningSessions-itemShutdown.jp-mod-styled:focus {
  148. border: none;
  149. box-shadow: none;
  150. background-color: rgba(153, 153, 153, 0.2);
  151. }