styling.css 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. /*-----------------------------------------------------------------------------
  2. | Copyright (c) 2014-2017, Jupyter Development Team.
  3. |
  4. | Distributed under the terms of the Modified BSD License.
  5. |----------------------------------------------------------------------------*/
  6. button.jp-mod-styled {
  7. font-size: var(--jp-ui-font-size1);
  8. color: var(--jp-ui-font-color0);
  9. border: none;
  10. box-sizing: border-box;
  11. text-align: center;
  12. height: 32px;
  13. width: 80px;
  14. letter-spacing: 0.8px;
  15. outline: none;
  16. appearance: none;
  17. -webkit-appearance: none;
  18. -moz-appearance: none;
  19. }
  20. input.jp-mod-styled {
  21. height: 32px;
  22. box-sizing: border-box;
  23. border: 1px solid #c8d3e9;
  24. border-radius: 2px;
  25. padding: 0 15px;
  26. font-size: 12px;
  27. color: var(--jp-ui-font-color0);
  28. outline: none;
  29. appearance: none;
  30. -webkit-appearance: none;
  31. -moz-appearance: none;
  32. transition: all 100ms;
  33. outline: 1px solid transparent;
  34. }
  35. input[type='checkbox'].jp-mod-styled {
  36. appearance: checkbox;
  37. -webkit-appearance: checkbox;
  38. -moz-appearance: checkbox;
  39. height: auto;
  40. }
  41. input.jp-mod-styled:focus {
  42. outline-color: #147bd1;
  43. }
  44. .jp-FileDialog-Checkbox {
  45. margin-top: 35px;
  46. display: flex;
  47. flex-direction: row;
  48. align-items: end;
  49. width: 100%;
  50. }
  51. .jp-FileDialog-Checkbox > label {
  52. flex: 1 1 auto;
  53. }
  54. .jp-select-wrapper {
  55. display: flex;
  56. position: relative;
  57. flex-direction: column;
  58. padding: 1px;
  59. background-color: var(--jp-layout-color1);
  60. height: 28px;
  61. box-sizing: border-box;
  62. margin-bottom: 12px;
  63. }
  64. .jp-select-wrapper.jp-mod-focused select.jp-mod-styled {
  65. border: var(--jp-border-width) solid var(--jp-input-active-border-color);
  66. box-shadow: var(--jp-input-box-shadow);
  67. background-color: var(--jp-input-active-background);
  68. }
  69. select.jp-mod-styled:hover {
  70. background-color: var(--jp-layout-color1);
  71. cursor: pointer;
  72. color: var(--jp-ui-font-color0);
  73. background-color: var(--jp-input-hover-background);
  74. box-shadow: inset 0 0px 1px rgba(0, 0, 0, 0.5);
  75. }
  76. select.jp-mod-styled {
  77. flex: 1 1 auto;
  78. height: 32px;
  79. width: 100%;
  80. font-size: var(--jp-ui-font-size2);
  81. background: var(--jp-input-background);
  82. color: var(--jp-ui-font-color0);
  83. padding: 0 25px 0 8px;
  84. border: var(--jp-border-width) solid var(--jp-input-border-color);
  85. border-radius: 0px;
  86. outline: none;
  87. appearance: none;
  88. -webkit-appearance: none;
  89. -moz-appearance: none;
  90. }