CoCalc Logo Icon
StoreFeaturesDocsShareSupportNewsAboutSign UpSign In
sagemathinc

Real-time collaboration for Jupyter Notebooks, Linux Terminals, LaTeX, VS Code, R IDE, and more,
all in one place.

GitHub Repository: sagemathinc/cocalc
 Path: blob/master/src/packages/frontend/_jupyter.sass
Views: 687
1
/*

2
 *  This file is part of CoCalc: Copyright © 2020 Sagemath, Inc.

3
 *  License: MS-RSL – see LICENSE.md for details

4
 */

5


6
// I just noticed there is another version of this file in jupyter/_jupyter.sass

7
// They need to be carefully merged into one!  But not today.

8


9
.smc-jupyter-nbviewer-content

10
  border: 1px solid lightgray

11


12
.smc-jupyter-nbviewer

13
  background: white

14
  position: fixed

15
  width: 100%

16


17
.smc-jupyter-notebook

18
  background: white

19
  width: 100%

20
  left: 0px

21
  min-height: 10em /* ensure path is covered while loading notebook */

22


23
.smc-jupyter-notebook-history-slider-controls

24
  position: absolute

25
  top: 8px

26
  right: 5px

27
  width: 80%

28
  background: white

29
  border: 2px solid orange

30
  border-radius: 4px

31
  padding: 20px

32
  box-shadow: 5px 6px 4px lightgray

33


34
.smc-jupyter-notebook-history-slider

35
  margin-top: 11px

36


37
.smc-jupyter-notebook-status-messages

38
  font-size: 10pt

39


40
.smc-jupyter-notebook-danger

41
  color: white

42
  font-weight: bold

43
  font-size: 7pt

44
  background: red

45


46
.smc-jupyter-history-revision-number

47
  font-size: 10pt

48


49
.smc-jupyter-history-revision-time

50
  font-size: 10pt

51


52
/* Used for new sync. */

53
.smc-jupyter-cursor

54
  position: absolute

55
  width: 15em

56
  z-index: 5 !important

57


58
.smc-jupyter-cursor-inside

59
  height: 1.2em

60
  width: 1px

61


62
.smc-jupyter-cursor-label

63
  font-size: 8pt

64
  font-family: serif

65
  color: #fff

66
  z-index: 1000

67


68
.smc-jupyter-notebook-notebook

69
  width: 100%

70


71
.cc-jupyter-snippets

72
  .ant-collapse-content-box

73
    padding: 0 !important

74


75
  span.hl

76
    background-color: yellow

77
    font-weight: bold

78


79
.cc-jupyter-snippet

80
  > div.ant-collapse-header

81
    color: $COL_GRAY !important

82


83
.cc-jupyter-snippet-collapse

84
  .cc-jupyter-snippet

85
    border-radius: 2px

86
    border: 0px

87
    overflow: hidden

88


89
.cc-jupyter-snippet-content

90
  background: white

91
  margin: 0 10px 10px 10px

92
  padding: 10px

93
  border: 1px solid $COL_GRAY_L

94
  border-radius: 3px

95
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.22)

96
  > pre

97
    font-size: 80%

98


99
.cc-jupyter-snippet-header

100
  vertical-align: -0.125em // to match ANTD's collapse icon

101
  p

102
    display: inline

103


104
// katex 0.13.5 somehow causes formulas to be displayed wider than the width of the output

105
// adding ugly horizontal scrollbars. this eliminates that.

106
.cocalc-jupyter-rendered

107
  .katex-display>.katex>.katex-html

108
    // display: contents // this did work, but it's some experimenal new display option

109
    margin: 1em .5em // margin works as well, but we also have to set it for mathjax to make it look consistent

110
  .katex

111
    padding: 0 2.5px

112


113
// this seems to be missing from jupyter widgets, but is used to implement the according

114
//   https://ipywidgets.readthedocs.io/en/latest/examples/Widget%20List.html#accordion

115
// I.e., without this css rule, accordian is just broken.

116
.lm-Widget.lm-mod-hidden

117
  display: none !important

118


119
.cc-jupyter-buttonbar-dropdown

120
  .ant-dropdown-menu-item

121
    color: $COL_GRAY_D !important

122


123