Skip to content

Commit 11a4f02

Browse files
committed
Update config files
1 parent 9390d0a commit 11a4f02

File tree

2 files changed

+265
-27
lines changed

2 files changed

+265
-27
lines changed

docs/navbarConfig.js

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,15 +49,20 @@ const navbar = {
4949
},
5050
{
5151
label: 'Deno Slack SDK',
52-
to: 'https://api.slack.com/automation/quickstart',
52+
to: 'https://tools.slack.dev/deno-slack-sdk/',
5353
target: '_self',
5454
},
5555
],
5656
},
57+
{
58+
to: 'https://tools.slack.dev/slack-cli',
59+
label: 'Slack CLI',
60+
target: '_self',
61+
},
5762
{
5863
type: 'dropdown',
5964
label: 'Community',
60-
position: 'left',
65+
position: 'right',
6166
items: [
6267
{
6368
label: 'Community tools',

docs/src/css/custom.css

Lines changed: 258 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,84 @@
11
:root {
2+
--ifm-font-size-base: 15px;
3+
24
/* set hex colors here pls */
5+
--dim: #eef2f6;
6+
37
--aubergine: #4a154b;
4-
/* aubergine-active is used in light mode.
5-
use something like #853c8c if you use as a link vs black text ( 3:1 contr) */
8+
--aubergine-background: #552555;
9+
--aubergine-dark: #2c0134;
10+
611
--aubergine-active: #7c3085;
7-
/* horchata is that beige color we use a lot */
12+
--aubergine-active-70: #7c308570;
13+
--aubergine-active-50: #7c308550;
14+
--aubergine-active-30: #7c308530;
15+
816
--horchata: #f4ede4;
9-
/* cloud blue from slack.dev. used for dark-mode links */
10-
--slack-cloud-blue: #1ab9ff;
11-
/* slack marketing color for links 1264A3. used for light-mode links */
17+
18+
--slack-red: #E3066A;
19+
--slack-red-70: #E3066A70;
20+
--slack-red-50: #E3066A50;
21+
--slack-red-30: #E3066A30;
22+
--slack-red-20: #E3066A20;
23+
24+
--slack-yellow: #FCC003;
25+
--slack-yellow-70: #FCC00370;
26+
--slack-yellow-50: #FCC00350;
27+
--slack-yellow-30: #FCC00330;
28+
--slack-yellow-20: #FCC00320;
29+
30+
--slack-green: #41B658;
31+
--slack-green-70: #41B65870;
32+
--slack-green-50: #41B65850;
33+
--slack-green-30: #41B65830;
34+
--slack-green-20: #41B65820;
35+
36+
--slack-blue: #1AB9FF;
37+
--slack-blue-70: #1AB9FF70;
38+
--slack-blue-50: #1AB9FF70;
39+
--slack-blue-30: #1AB9FF30;
40+
--slack-blue-20: #1AB9FF20;
41+
42+
/* used for dark-mode links */
43+
--slack-cloud-blue: #1AB9FF;
44+
/* slack marketing color used for light-mode links */
1245
--slack-dark-blue: #1264a3;
13-
--dim: #eef2f6;
46+
47+
/* used for functions */
48+
--unofficial-orange: #e36606;
49+
--unofficial-orange-70: #e3660670;
50+
--unofficial-orange-50: #e3660650;
51+
--unofficial-orange-30: #e3660630;
52+
53+
54+
/* turns opacity into flat colors for bubbles on top of things */
55+
--slack-yellow-70-flat: #FCC00370;
56+
57+
--slack-yellow-30-on-white: #feecb3;
58+
--slack-green-30-on-white: #c6e9cc;
59+
--slack-red-30-on-white: #f6b4d2;
60+
--slack-blue-30-on-white: #baeaff;
61+
--unofficial-orange-30-on-white: #f6d1b4;
62+
--aubergine-active-30-on-white: #d7c0da;
1463
}
1564

1665
/* resets striped tables that hurt me eyes */
1766
table tr:nth-child(even) {
1867
background-color: inherit;
1968
}
2069

70+
h1 {
71+
font-size: 2.5rem;
72+
}
73+
2174
/* changing the links to blue for accessibility */
2275
p a, .markdown a {
2376
color: var(--slack-cloud-blue);
77+
text-decoration: none;
78+
}
79+
80+
p a, .markdown a:hover {
81+
text-decoration: underline;
2482
}
2583

2684
a:hover {
@@ -31,10 +89,9 @@ a:hover {
3189
[data-theme="light"] {
3290
--docusaurus-highlighted-code-line-bg: var(--dim);
3391
--ifm-color-primary: var(--aubergine-active);
34-
--ifm-footer-background-color: var(--horchata);
35-
--ifm-footer-color: black;
92+
--ifm-footer-background-color: white;
3693
--slack-cloud-blue: var(--slack-dark-blue);
37-
--ifm-table-stripe-background: var(--horchata);
94+
--reference-section-color: var(--horchata);
3895
}
3996

4097
[data-theme="dark"] {
@@ -45,6 +102,48 @@ a:hover {
45102
--ifm-footer-color: white;
46103
}
47104

105+
.alert--warning {
106+
--ifm-alert-background-color: var(--slack-yellow-30);
107+
--ifm-alert-border-color: var(--slack-yellow);
108+
--ifm-alert-background-color-highlight: var(--slack-yellow-30);
109+
110+
}
111+
112+
.alert--info {
113+
--ifm-alert-background-color: var(--slack-blue-30);
114+
--ifm-alert-border-color: var(--slack-blue);
115+
/* --ifm-alert-background-color-highlight: var(--slack-blue-30); */
116+
117+
}
118+
119+
.alert--danger {
120+
--ifm-alert-background-color: var(--slack-red-30);
121+
--ifm-alert-border-color: var(--slack-red);
122+
}
123+
124+
.alert--success {
125+
--ifm-alert-background-color: var(--slack-green-30);
126+
--ifm-alert-border-color: var(--slack-green);
127+
}
128+
129+
.footer {
130+
font-size: 80%;
131+
padding-bottom: 0rem;
132+
}
133+
134+
.footer__items a {
135+
color: inherit;
136+
}
137+
138+
.footer .container {
139+
margin:0
140+
}
141+
142+
/* adjusting size */
143+
.table-of-contents__link {
144+
font-size: 1rem
145+
}
146+
48147
/* bolding ToC for contrast */
49148
.table-of-contents__link--active {
50149
font-weight: bold;
@@ -55,11 +154,30 @@ a:hover {
55154
border-left: none !important;
56155
}
57156

58-
/* increasing name of SDK in sidebar */
157+
/* increasing name of site in sidebar */
59158
.sidebar-title {
60-
font-size: 1.25em; /* Adjust the size as needed */
159+
/* padding-bottom: 0.5rem;
160+
font-size: 1.25em; */
61161
font-weight: bold;
62-
color: #000;
162+
}
163+
164+
.theme-doc-sidebar-item-link hr {
165+
margin: 1rem;
166+
}
167+
168+
.sidebar-sdk-title{
169+
/* margin: 0.5rem 0; */
170+
padding: 0.5rem;
171+
/* border-radius: 4px; */
172+
border-bottom: .5px solid grey;
173+
}
174+
175+
.theme-doc-sidebar-item-category-level-1 .menu__link {
176+
font-weight: bold;
177+
}
178+
179+
.theme-doc-sidebar-item-category-level-1 .menu__list-item .menu__link {
180+
font-weight: normal;
63181
}
64182

65183
/* removing sidebar line and adding space to match ToC */
@@ -105,35 +223,49 @@ html[data-theme="dark"] .navbar-github-link::before {
105223

106224
/* Delineate tab blocks */
107225
.tabs-container {
108-
border: 1px solid var(--ifm-color-primary); /* Adjust the color and thickness as needed */
109-
border-radius: 5px; /* To give rounded corners */
110-
padding: 0.5em; /* To add spacing inside the tab */
226+
border: 1px solid var(--ifm-color-primary);
227+
border-radius: 5px;
228+
padding: 0.5em;
111229
}
112230

113231
/* Docs code bubbles */
114232
[data-theme="light"] {
115-
--code-link-background: #CFE9FE;
233+
--contrast-color: black;
234+
--code-link-background: var(--slack-blue-30);
116235
--code-link-text: rgb(21, 50, 59);
117236

118-
--method-link-background: #CDEFC4;
237+
--method-link-background: var(--slack-green-30-on-white);
119238
--method-link-text: rgb(0, 41, 0);
120239

121-
--scope-link-background: #FBF3E0;
240+
--scope-link-background: var(--slack-yellow-30-on-white);
122241
--scope-link-text: rgb(63, 46, 0);
123242

124-
--event-link-background: #FDDDE3;
125-
--event-link-text: rgb(74, 21, 75);
243+
--event-link-background: var(--slack-red-30-on-white);
244+
--event-link-text: rgb(63, 0, 24);
245+
246+
--function-link-background: var(--unofficial-orange-30-on-white);
247+
--function-link-text: rgb(75, 35, 0);
248+
249+
--command-link-background: var(--aubergine-active-30-on-white);
250+
--command-link-text: rgb(75, 0, 75);
126251
}
127252

128253
[data-theme="dark"] {
254+
--contrast-color: white;
129255
--code-link-text: white;
130256
--method-link-text: white;
131257
--scope-link-text: white;
132258
--event-link-text: white;
133-
--code-link-background: #1AB9FF50;
134-
--method-link-background: #41B65850;
135-
--scope-link-background: #FCC00350;
136-
--event-link-background: #E3066A50;
259+
--function-link-text: white;
260+
--command-link-text: white;
261+
262+
--code-link-background: var(--slack-blue-70);
263+
--method-link-background: var(--slack-green-70);
264+
--scope-link-background: var(--slack-yellow-70);
265+
--event-link-background: var(--slack-red-70);
266+
--command-link-background: var(--aubergine-active);
267+
--function-link-background: var(--unofficial-orange-70);
268+
137269
}
138270

139271
a code {
@@ -154,4 +286,105 @@ a[href^="https://api.slack.com/scopes"] > code {
154286
a[href^="https://api.slack.com/events"] > code {
155287
background-color: var(--event-link-background);
156288
color: var(--event-link-text);
289+
}
290+
291+
a[href^="/deno-slack-sdk/reference/slack-functions/"] > code {
292+
background-color: var(--function-link-background);
293+
color: var(--function-link-text);
294+
}
295+
296+
a[href^="/deno-slack-sdk/reference/connector-functions/"] > code {
297+
background-color: var(--function-link-background);
298+
color: var(--function-link-text);
299+
}
300+
301+
a[href^="/slack-cli/reference/commands"] > code {
302+
background-color: var(--command-link-background);
303+
color: var(--command-link-text);
304+
}
305+
306+
.facts-section {
307+
background-color: var(--slack-green-20) !important;
308+
}
309+
310+
.auth-section {
311+
background-color: var(--slack-red-20) !important;
312+
}
313+
314+
.inputs-section {
315+
background-color: var(--slack-blue-20) !important;
316+
}
317+
318+
.functions-section {
319+
border-radius: 6px;
320+
padding:1rem;
321+
margin-bottom: 2rem;
322+
}
323+
324+
.scope-list {
325+
display: flex;
326+
flex-wrap: wrap;
327+
gap: 1rem;
328+
}
329+
330+
.scope-item {
331+
display: inline-block;
332+
}
333+
334+
.functions-section .type {
335+
text-align: right;
336+
}
337+
338+
.param-required-section {
339+
padding-top: 1rem;
340+
margin-bottom: 1rem;
341+
}
342+
343+
.param-container {
344+
border-top: 0.5px solid;
345+
padding-top: 1rem;
346+
padding-bottom: 1rem;
347+
}
348+
349+
.param-container:last-child {
350+
padding-bottom: 0;
351+
}
352+
353+
.param-top-row {
354+
display: flex;
355+
align-items: center;
356+
margin-bottom: 1rem;
357+
}
358+
359+
/* left-align param name */
360+
.param-top-row .name {
361+
flex: 1;
362+
}
363+
364+
/* right-align Required and Type */
365+
.param-top-row .required,
366+
.param-top-row .type {
367+
margin-left: auto;
368+
text-align: right;
369+
}
370+
371+
/* add space between Required and Type */
372+
.param-top-row .required {
373+
margin-left: 10px;
374+
}
375+
376+
.info-row {
377+
display: flex;
378+
align-items: center;
379+
margin-bottom: 1rem;
380+
}
381+
382+
.info-key {
383+
flex: 0 0 10rem;
384+
align-items: center;
385+
}
386+
387+
/* hides next and previous */
388+
.pagination-nav__link {
389+
display: none;
157390
}

0 commit comments

Comments
 (0)