base.css 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321
  1. /*-----------------------------------------------------------------------------
  2. | Copyright (c) Jupyter Development Team.
  3. | Distributed under the terms of the Modified BSD License.
  4. |----------------------------------------------------------------------------*/
  5. /*-----------------------------------------------------------------------------
  6. | Variables
  7. |----------------------------------------------------------------------------*/
  8. :root {
  9. --jp-private-filebrowser-button-height: 28px;
  10. --jp-private-filebrowser-button-width: 48px;
  11. }
  12. /*-----------------------------------------------------------------------------
  13. | Copyright (c) Jupyter Development Team.
  14. | Distributed under the terms of the Modified BSD License.
  15. |----------------------------------------------------------------------------*/
  16. .jp-FileBrowser {
  17. display: flex;
  18. flex-direction: column;
  19. color: var(--jp-ui-font-color1);
  20. background: var(--jp-layout-color1);
  21. /* This is needed so that all font sizing of children done in ems is
  22. * relative to this base size */
  23. font-size: var(--jp-ui-font-size1);
  24. }
  25. .jp-FileBrowser-toolbar.jp-Toolbar {
  26. border-bottom: none;
  27. height: auto;
  28. margin: 8px 12px 0px 12px;
  29. padding: 0px;
  30. box-shadow: none;
  31. justify-content: flex-start;
  32. }
  33. .jp-FileBrowser-header {
  34. margin: 5px;
  35. padding: 15px;
  36. font-weight: bold;
  37. border-bottom: 1px solid #dbe3ea;
  38. }
  39. /* 头部切换导航 */
  40. .jp-FileBrowser-SwitchButton {
  41. margin: 5px;
  42. padding: 10px 12px 20px;
  43. border-bottom: 1px solid #dbe3ea;
  44. display: flex;
  45. align-items: center;
  46. }
  47. .jp-BreadCrumbs {
  48. flex: 0 0 auto;
  49. margin: 8px 12px 8px 12px;
  50. }
  51. .jp-BreadCrumbs-item {
  52. margin: 0px 2px;
  53. padding: 0px 2px;
  54. border-radius: var(--jp-border-radius);
  55. cursor: pointer;
  56. }
  57. .jp-BreadCrumbs-item:hover {
  58. background-color: var(--jp-layout-color2);
  59. }
  60. .jp-BreadCrumbs-item:first-child {
  61. margin-left: 0px;
  62. }
  63. .jp-BreadCrumbs-item.jp-mod-dropTarget {
  64. background-color: var(--jp-brand-color2);
  65. opacity: 0.7;
  66. }
  67. /*-----------------------------------------------------------------------------
  68. | Buttons
  69. |----------------------------------------------------------------------------*/
  70. .jp-FileBrowser-toolbar > .jp-Toolbar-item {
  71. flex: 0 0 auto;
  72. padding-left: 0px;
  73. padding-right: 2px;
  74. }
  75. .jp-FileBrowser-toolbar > .jp-Toolbar-item .jp-ToolbarButtonComponent {
  76. width: 40px;
  77. }
  78. .jp-FileBrowser-toolbar
  79. .jp-ToolbarButtonComponent[data-command='filebrowser:create-main-launcher'] {
  80. width: 72px;
  81. background: var(--jp-brand-color1);
  82. }
  83. .jp-FileBrowser-toolbar
  84. .jp-ToolbarButtonComponent[data-command='filebrowser:create-main-launcher']:hover,
  85. .jp-FileBrowser-toolbar
  86. .jp-ToolbarButtonComponent[data-command='filebrowser:create-main-launcher']:focus-visible {
  87. background-color: var(--jp-brand-color0) !important;
  88. }
  89. .jp-FileBrowser-toolbar
  90. .jp-ToolbarButtonComponent[data-command='filebrowser:create-main-launcher']
  91. .jp-icon3 {
  92. fill: var(--jp-layout-color1);
  93. }
  94. /*-----------------------------------------------------------------------------
  95. | Other styles
  96. |----------------------------------------------------------------------------*/
  97. .jp-FileDialog.jp-mod-conflict input {
  98. color: var(--jp-error-color1);
  99. }
  100. .jp-FileDialog .jp-new-name-title {
  101. margin-top: 12px;
  102. }
  103. .jp-LastModified-hidden {
  104. display: none;
  105. }
  106. .jp-FileBrowser-filterBox {
  107. padding: 0px;
  108. flex: 0 0 auto;
  109. margin: 8px 12px 0px 12px;
  110. }
  111. /*-----------------------------------------------------------------------------
  112. | DirListing
  113. |----------------------------------------------------------------------------*/
  114. .jp-DirListing {
  115. flex: 1 1 auto;
  116. display: flex;
  117. flex-direction: column;
  118. outline: 0;
  119. }
  120. .jp-DirListing-header {
  121. flex: 0 0 auto;
  122. display: none;
  123. flex-direction: row;
  124. overflow: hidden;
  125. border-top: var(--jp-border-width) solid var(--jp-border-color2);
  126. border-bottom: var(--jp-border-width) solid var(--jp-border-color1);
  127. box-shadow: var(--jp-toolbar-box-shadow);
  128. z-index: 2;
  129. }
  130. .jp-DirListing-headerItem {
  131. padding: 4px 12px 2px 12px;
  132. font-weight: 500;
  133. }
  134. .jp-DirListing-headerItem:hover {
  135. background: var(--jp-layout-color2);
  136. }
  137. .jp-DirListing-headerItem.jp-id-name {
  138. flex: 1 0 84px;
  139. }
  140. .jp-DirListing-headerItem.jp-id-modified {
  141. flex: 0 0 112px;
  142. border-left: var(--jp-border-width) solid var(--jp-border-color2);
  143. text-align: right;
  144. }
  145. .jp-id-narrow {
  146. display: none;
  147. flex: 0 0 5px;
  148. padding: 4px 4px;
  149. border-left: var(--jp-border-width) solid var(--jp-border-color2);
  150. text-align: right;
  151. color: var(--jp-border-color2);
  152. }
  153. .jp-DirListing-narrow .jp-id-narrow {
  154. display: block;
  155. }
  156. .jp-DirListing-narrow .jp-id-modified,
  157. .jp-DirListing-narrow .jp-DirListing-itemModified {
  158. display: none;
  159. }
  160. .jp-DirListing-headerItem.jp-mod-selected {
  161. font-weight: 600;
  162. }
  163. /* increase specificity to override bundled default */
  164. .jp-DirListing-content {
  165. flex: 1 1 auto;
  166. margin: 0;
  167. padding: 0;
  168. list-style-type: none;
  169. overflow: auto;
  170. }
  171. .jp-DirListing-content mark {
  172. color: var(--jp-ui-font-color0);
  173. background-color: transparent;
  174. font-weight: bold;
  175. }
  176. .jp-DirListing-content .jp-DirListing-item.jp-mod-selected mark {
  177. color: var(--jp-ui-inverse-font-color0);
  178. }
  179. /* Style the directory listing content when a user drops a file to upload */
  180. .jp-DirListing.jp-mod-native-drop .jp-DirListing-content {
  181. outline: 5px dashed rgba(128, 128, 128, 0.5);
  182. outline-offset: -10px;
  183. cursor: copy;
  184. }
  185. .jp-DirListing-item {
  186. display: flex;
  187. flex-direction: row;
  188. padding: 4px 12px;
  189. -webkit-user-select: none;
  190. -moz-user-select: none;
  191. -ms-user-select: none;
  192. user-select: none;
  193. }
  194. .jp-DirListing-item[data-is-dot] {
  195. opacity: 75%;
  196. }
  197. .jp-DirListing-item.jp-mod-selected {
  198. color: var(--jp-ui-inverse-font-color1);
  199. background: var(--jp-brand-color1);
  200. }
  201. .jp-DirListing-item.jp-mod-dropTarget {
  202. background: var(--jp-brand-color3);
  203. }
  204. .jp-DirListing-item:hover:not(.jp-mod-selected) {
  205. background: var(--jp-layout-color2);
  206. }
  207. .jp-DirListing-itemIcon {
  208. flex: 0 0 20px;
  209. margin-right: 4px;
  210. }
  211. .jp-DirListing-itemText {
  212. flex: 1 0 64px;
  213. white-space: nowrap;
  214. overflow: hidden;
  215. text-overflow: ellipsis;
  216. user-select: none;
  217. }
  218. .jp-DirListing-itemModified {
  219. display: none;
  220. flex: 0 0 125px;
  221. text-align: right;
  222. }
  223. .jp-DirListing-editor {
  224. flex: 1 0 64px;
  225. outline: none;
  226. border: none;
  227. }
  228. .jp-DirListing-item.jp-mod-running .jp-DirListing-itemIcon:before {
  229. color: var(--jp-success-color1);
  230. content: '\25CF';
  231. font-size: 8px;
  232. position: absolute;
  233. left: -8px;
  234. }
  235. .jp-DirListing-item.jp-mod-running.jp-mod-selected
  236. .jp-DirListing-itemIcon:before {
  237. color: var(--jp-ui-inverse-font-color1);
  238. }
  239. .jp-DirListing-item.lm-mod-drag-image,
  240. .jp-DirListing-item.jp-mod-selected.lm-mod-drag-image {
  241. font-size: var(--jp-ui-font-size1);
  242. padding-left: 4px;
  243. margin-left: 4px;
  244. width: 160px;
  245. background-color: var(--jp-ui-inverse-font-color2);
  246. box-shadow: var(--jp-elevation-z2);
  247. border-radius: 0px;
  248. color: var(--jp-ui-font-color1);
  249. transform: translateX(-40%) translateY(-58%);
  250. }
  251. .jp-DirListing-deadSpace {
  252. flex: 1 1 auto;
  253. margin: 0;
  254. padding: 0;
  255. list-style-type: none;
  256. overflow: auto;
  257. background-color: var(--jp-layout-color1);
  258. }
  259. .jp-Document {
  260. min-width: 120px;
  261. min-height: 120px;
  262. outline: none;
  263. }
  264. .dag-data {
  265. height: 100%;
  266. }
  267. @import './datamanage.css';
  268. @import './dataview.css';