sphinx-thebe.css 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130
  1. /* Thebelab Buttons */
  2. .thebelab-button {
  3. z-index: 999;
  4. display: inline-block;
  5. padding: 0.35em 1.2em;
  6. margin: 0px 1px;
  7. border-radius: 0.12em;
  8. box-sizing: border-box;
  9. text-decoration: none;
  10. font-family: "Roboto", sans-serif;
  11. font-weight: 300;
  12. text-align: center;
  13. transition: all 0.2s;
  14. background-color: #dddddd;
  15. border: 0.05em solid white;
  16. color: #000000;
  17. }
  18. .thebelab-button:hover {
  19. border: 0.05em solid black;
  20. background-color: #fcfcfc;
  21. }
  22. .thebe-launch-button {
  23. height: 2.2em;
  24. font-size: 0.8em;
  25. border: 1px black solid;
  26. }
  27. /* Thebelab Cell */
  28. .thebelab-cell pre {
  29. background: none;
  30. }
  31. .thebelab-cell .thebelab-input {
  32. padding-left: 1em;
  33. margin-bottom: 0.5em;
  34. margin-top: 0.5em;
  35. }
  36. .thebelab-cell .jp-OutputArea {
  37. margin-top: 0.5em;
  38. margin-left: 1em;
  39. }
  40. button.thebelab-button.thebelab-run-button {
  41. margin-left: 1.5em;
  42. margin-bottom: 0.5em;
  43. }
  44. /* Loading button */
  45. button.thebe-launch-button div.spinner {
  46. float: left;
  47. margin-right: 1em;
  48. }
  49. /* Remove the spinner when thebelab is ready */
  50. .thebe-launch-button.thebe-status-ready .spinner {
  51. display: none;
  52. }
  53. .thebe-launch-button span.status {
  54. font-family: monospace;
  55. font-weight: bold;
  56. }
  57. .thebe-launch-button.thebe-status-ready span.status {
  58. color: green;
  59. }
  60. .spinner {
  61. height: 2em;
  62. text-align: center;
  63. font-size: 0.7em;
  64. }
  65. .spinner > div {
  66. background-color: #f37726;
  67. height: 100%;
  68. width: 6px;
  69. display: inline-block;
  70. -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
  71. animation: sk-stretchdelay 1.2s infinite ease-in-out;
  72. }
  73. .spinner .rect2 {
  74. -webkit-animation-delay: -1.1s;
  75. animation-delay: -1.1s;
  76. }
  77. .spinner .rect3 {
  78. -webkit-animation-delay: -1s;
  79. animation-delay: -1s;
  80. }
  81. .spinner .rect4 {
  82. -webkit-animation-delay: -0.9s;
  83. animation-delay: -0.9s;
  84. }
  85. .spinner .rect5 {
  86. -webkit-animation-delay: -0.8s;
  87. animation-delay: -0.8s;
  88. }
  89. @-webkit-keyframes sk-stretchdelay {
  90. 0%,
  91. 40%,
  92. 100% {
  93. -webkit-transform: scaleY(0.4);
  94. }
  95. 20% {
  96. -webkit-transform: scaleY(1);
  97. }
  98. }
  99. @keyframes sk-stretchdelay {
  100. 0%,
  101. 40%,
  102. 100% {
  103. transform: scaleY(0.4);
  104. -webkit-transform: scaleY(0.4);
  105. }
  106. 20% {
  107. transform: scaleY(1);
  108. -webkit-transform: scaleY(1);
  109. }
  110. }