docs/style.css at main · datum-cloud/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
131
132
133
134
135
136
137
138
139
140
141
142
143
/* Match datum.net border radius (rounded-md = 6px) */
[class~="rounded-lg"],
[class~="rounded-xl"],
[class~="rounded-2xl"],
[class~="rounded-search"] {
  border-radius: 0rem !important;
}

[class~="rounded-l-xl"] {
  border-top-left-radius: 0rem !important;
  border-bottom-left-radius: 0rem !important;
}

[class~="rounded-r-xl"] {
  border-top-right-radius: 0rem !important;
  border-bottom-right-radius: 0rem !important;
}

/* Square off mobile tab selector */
button[aria-haspopup="menu"] {
  border-radius: 0 !important;
}

/* Inline code contrast in light mode */
html:not(.dark) code:not(pre code) {
  background-color: #e2e4e6;
}

/* Navbar: glass frost effect */
#navbar-transition {
  align-items: center !important;
  background-color: rgba(255, 255, 255, 0.45) !important;
  backdrop-filter: blur(20px) saturate(1.8) brightness(1.05) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.8) brightness(1.05) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.07) !important;
}

.dark #navbar-transition {
  background-color: rgba(12, 29, 49, 0.35) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}

/* Logo size */
img.nav-logo {
  height: 27px !important;
}

/* Gaps between tab nav items */
.nav-tabs {
  column-gap: 40px !important;
}

/* Narrower left sidebar */
#sidebar {
  width: 260px !important;
}

/* Smaller contextual menu */
#page-context-menu button {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  padding-left: 8px !important;
  padding-right: 8px !important;
}

#page-context-menu .flex.items-center.gap-2 {
  gap: 4px !important;
}

#page-context-menu svg {
  width: 13px !important;
  height: 13px !important;
}

/* Tighter sidebar nav item padding */
#navigation-items a {
  padding-top: 3px !important;
  padding-bottom: 3px !important;
}

/* Tighter sidebar group header bottom margin */
#navigation-items .sidebar-group-header {
  margin-bottom: 6px !important;
}

/* Spacing between section groups */
#navigation-items > div {
  margin-top: 28px !important;
}

/* Muted auto-generated footer text */
.mdx-content h6:last-child {
  font-size: 0.8rem !important;
  font-weight: 400 !important;
  color: #9ca3af !important;
  margin-top: 2rem !important;
}

/* Tighter anchor gaps */
a.nav-anchor {
  margin-bottom: 4px !important;
}

/* Tighter ToC item padding */
#table-of-contents-content .toc-item a {
  padding-top: 3px !important;
  padding-bottom: 3px !important;
}

/* Dashboard button in navbar — desktop only */
@media (min-width: 1024px) {
  li.navbar-link a[href="https://app.datum.net"] {
    background-color: #BF9595;
    color: #fff !important;
    padding: 5px 14px !important;
    border-radius: 0;
    font-weight: 500 !important;
    transition: background-color 0.15s ease;
  }

  li.navbar-link a[href="https://app.datum.net"]:hover {
    background-color: #4D6356 !important;
    color: #fff !important;
  }

  .dark li.navbar-link a[href="https://app.datum.net"] {
    background-color: #BF9595;
    color: #fff !important;
  }
}

/* Active nav state */
#navigation-items li[data-active="true"] > a {
  background-color: #4D6356 !important;
  color: #E6F59F !important;
  text-shadow: none !important;
}

.dark #navigation-items li[data-active="true"] > a {
  background-color: #E6F59F !important;
  color: #4D6356 !important;
  text-shadow: none !important;
}