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 */
1766table 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 */
2275p 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
2684a : 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
139271a code {
@@ -154,4 +286,105 @@ a[href^="https://api.slack.com/scopes"] > code {
154286a [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