toolbar.css 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. /*-----------------------------------------------------------------------------
  2. | Copyright (c) 2014-2016, Jupyter Development Team.
  3. |
  4. | Distributed under the terms of the Modified BSD License.
  5. |----------------------------------------------------------------------------*/
  6. :root {
  7. --jp-private-toolbar-height: 24px;
  8. }
  9. .jp-Toolbar {
  10. color: var(--jp-ui-font-color1);
  11. flex: 0 0 auto;
  12. display: flex;
  13. flex-direction: row;
  14. border-bottom: var(--jp-border-width) solid var(--jp-border-color2);
  15. height: calc(var(--jp-private-toolbar-height) + var(--jp-border-width));
  16. }
  17. .jp-Toolbar > .jp-Toolbar-item {
  18. flex: 0 0 auto;
  19. padding-left: 8px;
  20. padding-right: 8px;
  21. font-size: var(--jp-ui-font-size1);
  22. line-height: var(--jp-private-toolbar-height);
  23. height: 100%;
  24. }
  25. .jp-Toolbar-item.jp-Toolbar-button {
  26. display: inline-block;
  27. width: 32px;
  28. background-color: white;
  29. background-repeat: no-repeat;
  30. background-position: center;
  31. background-size: 16px;
  32. }
  33. .jp-Toolbar-button.jp-mod-pressed {
  34. background-color: var(--jp-layout-color3);
  35. box-shadow: inset 0 0px 1px rgba(0, 0, 0, 0.5);
  36. }
  37. .jp-Toolbar-button:hover {
  38. background-color: var(--jp-layout-color2);
  39. box-shadow: inset 0 0px 1px rgba(0, 0, 0, 0.5);
  40. }
  41. .jp-Toolbar > .jp-Toolbar-item.jp-Toolbar-kernelName {
  42. text-align: right;
  43. flex-grow: 1;
  44. flex-shrink: 1;
  45. font-size: var(--jp-ui-font-size1);
  46. line-height: calc( var(--jp-private-toolbar-height) + 1px );
  47. }
  48. .jp-Toolbar-item.jp-Toolbar-kernelStatus {
  49. display: inline-block;
  50. width: 32px;
  51. background-repeat: no-repeat;
  52. background-position: center;
  53. background-size: 16px;
  54. }