buttons.css 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. /*-----------------------------------------------------------------------------
  2. | Variables
  3. |----------------------------------------------------------------------------*/
  4. :root {
  5. --jp-flat-button-height: 24px;
  6. --jp-flat-button-padding: 8px 12px;
  7. }
  8. /*-----------------------------------------------------------------------------
  9. | Copyright (c) Jupyter Development Team.
  10. | Distributed under the terms of the Modified BSD License.
  11. |----------------------------------------------------------------------------*/
  12. button {
  13. border-radius: var(--jp-border-radius);
  14. }
  15. button:focus-visible {
  16. border: 1px solid var(--jp-brand-color1);
  17. }
  18. button.jp-mod-styled.jp-mod-accept {
  19. background: var(--md-blue-500);
  20. border: 0;
  21. color: white;
  22. }
  23. button.jp-mod-styled.jp-mod-accept:hover {
  24. background: var(--md-blue-600);
  25. }
  26. button.jp-mod-styled.jp-mod-accept:active {
  27. background: var(--md-blue-700);
  28. }
  29. button.jp-mod-styled.jp-mod-reject {
  30. background: var(--md-grey-500);
  31. border: 0;
  32. color: white;
  33. }
  34. button.jp-mod-styled.jp-mod-reject:hover {
  35. background: var(--md-grey-600);
  36. }
  37. button.jp-mod-styled.jp-mod-reject:active {
  38. background: var(--md-grey-700);
  39. }
  40. button.jp-mod-styled.jp-mod-warn {
  41. background: var(--jp-error-color1);
  42. border: 0;
  43. color: white;
  44. }
  45. button.jp-mod-styled.jp-mod-warn:hover {
  46. background: var(--md-red-600);
  47. }
  48. button.jp-mod-styled.jp-mod-warn:active {
  49. background: var(--md-red-700);
  50. }
  51. .jp-Button-flat {
  52. text-decoration: none;
  53. padding: var(--jp-flat-button-padding);
  54. color: var(--jp-warn-color1);
  55. font-weight: 500;
  56. background-color: transparent;
  57. height: var(--jp-private-running-shutdown-button-height);
  58. line-height: var(--jp-private-running-shutdown-button-height);
  59. transition: background-color 0.1s ease;
  60. border-radius: 2px;
  61. }
  62. .jp-Button-flat:hover {
  63. background-color: rgba(153, 153, 153, 0.1);
  64. }
  65. .jp-Button-flat:focus {
  66. border: none;
  67. box-shadow: none;
  68. background-color: rgba(153, 153, 153, 0.2);
  69. }