docs/style.css at main · mixpanel/docs · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
.dark li[id="topbar-cta-button"] > a > span {
  background-color: #8363fe !important;
}

h5,
h6 {
  font-weight: bold;
}

.create-service-account {
  display: flex;
  margin: 18px 0;
}

.create-service-account img {
  width: 80%;
}

@media (max-width: 1400px) {
  .create-service-account img {
    width: 100%;
  }
}

.mixpanel-custom-two-column {
  display: flex;
  margin: 18px 0;
}

.mixpanel-custom-two-column div {
  width: 100%;
  margin: 15px 0;
}

.mixpanel-custom-two-column .image-container {
  display: flex;
}

.mixpanel-custom-two-column .image-container img {
  height: 300px;
}

#navbar > div.z-0.absolute.inset-0.bg-background-light.dark\:bg-background-dark,
#navbar > div.z-10.relative > div.hidden.lg\:block.bg-gray-50.dark\:bg-gray-900 {
  background-color: #f5f2f2 !important;
}

.dark #navbar > div.z-0.absolute.inset-0.bg-background-light.dark\:bg-background-dark,
.dark #navbar > div.z-10.relative > div.hidden.lg\:block.bg-gray-50.dark\:bg-gray-900 {
  background-color: #2b273f !important;
}

ul.contains-task-list,
ul.contains-task-list > li.task-list-item {
  padding-left: 0 !important;
}

ul.contains-task-list > li.task-list-item:before {
  width: 0;
  height: 0;
}

.dark #content {
  color: #e2e1e6;
}

.mxp-cookie-preferences-link {
  display: inline-block;
  margin-left: 1rem;
  font-size: 0.875rem;
  color: inherit;
  opacity: 0.7;
  text-decoration: none;
}

.mxp-cookie-preferences-link:hover {
  opacity: 1;
}

/* Changelog subscribe button + modal. Mintlify's Tailwind build ships a fixed
   utility subset that omits arbitrary-value (e.g. from-[#7856ff]), gradient,
   and backdrop utilities, so the brand styles are defined here instead. */
.mxp-subscribe-button {
  background-image: linear-gradient(to top, #7856ff, #9075ff);
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}

.mxp-subscribe-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.mxp-subscribe-dialog {
  /* Tailwind's Preflight resets margin to 0 on every element, which overrides
     the UA style that centers a modal <dialog>; restore it. */
  margin: auto;
}

.mxp-subscribe-dialog::backdrop {
  background-color: rgb(0 0 0 / 0.8);
}

.mxp-subscribe-modal {
  background-color: #fbf9f9;
}

.dark .mxp-subscribe-modal {
  background-color: #201f24;
}

.mxp-subscribe-error {
  color: #cc332b;
}

/* Quickstart / funnels "next step" CTA (ExtendedButton). Same Tailwind gaps as
   above: the gradient, arbitrary colors, py-2.5, and hover:shadow-md aren't in
   Mintlify's build. */
.mxp-extended-button {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  background-image: linear-gradient(to bottom, #9b7eff, #7856ff);
}

.mxp-extended-button:hover {
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}

.mxp-extended-button:active {
  background-image: linear-gradient(to bottom, #9b7eff, #5028c0);
}