Skip to content

Commit c7ad6ae

Browse files
authored
docs: Improvements (#79)
## Description Landing Page text changes, docs color changes ### Type of change - [ ] Bug fix (non-breaking change which fixes an issue) - [ ] New feature (non-breaking change which adds functionality) - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected) - [x] Documentation update (improves or adds clarity to existing documentation) ### Checklist - [x] I have performed a self-review of my code - [x] I have commented my code, particularly in hard-to-understand areas - [x] I have updated the documentation accordingly - [x] My changes generate no new warnings
1 parent 3627631 commit c7ad6ae

File tree

6 files changed

+96
-61
lines changed

6 files changed

+96
-61
lines changed

docs/docs/llms/exporting-llama.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,6 @@ Navigate to the `llama_export` directory and run the following command:
3535

3636
The script will pull a Docker image from Docker Hub, and then run it to export the model. By default the output (llama3_2.pte file) will be saved in the `llama-export/outputs` directory. However, you can override that behavior with the `--output-path [path]` flag.
3737

38-
:::note[Note]
38+
:::note
3939
This Docker image was tested on MacOS with ARM chip. This might not work in other environments.
4040
:::

docs/src/css/colors.css

+59-56
Original file line numberDiff line numberDiff line change
@@ -15,15 +15,6 @@
1515
--swm-navy-dark-40: #abbcf5;
1616
--swm-navy-dark-20: #c1c6e5;
1717

18-
/* react-native-executorch */
19-
--swm-cornflower-100: #4B6CF4;
20-
--swm-cornflower-80: #7394FF;
21-
--swm-cornflower-60: #A6C2FF;
22-
--swm-cornflower-0: #F7FAFF;
23-
24-
--swm-navy-100: #160042;
25-
/* end react-native-executorch */
26-
2718
--swm-purple-light-100: #782aeb;
2819
--swm-purple-light-80: #b58df1;
2920
--swm-purple-light-60: #d1bbf3;
@@ -92,6 +83,18 @@
9283
--swm-yellow-dark-60: #fff1b2;
9384
--swm-yellow-dark-40: #fff9db;
9485

86+
/* react-native-executorch */
87+
--swm-navy-100: #160042;
88+
89+
--swm-cornflower-140: #23326f;
90+
--swm-cornflower-120: #3851b4;
91+
--swm-cornflower-100: #4B6CF4;
92+
--swm-cornflower-80: #7394FF;
93+
--swm-cornflower-60: #A6C2FF;
94+
--swm-cornflower-40: #D0E2FF;
95+
--swm-cornflower-20: #E6EFFF;
96+
--swm-cornflower-0: #F7FAFF;
97+
9598
/* Black & White palette, mainly for background settings */
9699
--swm-off-white: #f8f9ff;
97100
--swm-white: #fcfcff;
@@ -133,34 +136,34 @@
133136

134137
/* Tabs */
135138
--swm-tab: var(--swm-navy-light-20);
136-
--swm-tab-hover: var(--swm-blue-light-80);
137-
--swm-tab-active: var(--swm-blue-light-100);
139+
--swm-tab-hover: var(--swm-cornflower-80);
140+
--swm-tab-active: var(--swm-cornflower-100);
138141

139142
/* Table of Contents */
140143
--ifm-toc-border-color: transparent;
141144
--ifm-toc-link-color: var(--swm-navy-light-60);
142145
--ifm-toc-link-color-active: var(--swm-navy-light-100);
143146

144-
--swm-hire-us-toc: var(--swm-navy-light-100);
147+
--swm-hire-us-toc: var(--swm-cornflower-100);
145148
--swm-hire-us-toc-color: var(--swm-off-white);
146-
--swm-hire-us-toc-color-hover: var(--swm-navy-light-100);
147-
--swm-hire-us-toc-border-hover: var(--swm-navy-light-100);
149+
--swm-hire-us-toc-color-hover: var(--swm-cornflower-100);
150+
--swm-hire-us-toc-border-hover: var(--swm-cornflower-100);
148151

149152
/* Details section */
150-
--swm-details-foreground: var(--swm-purple-light-20);
151-
--swm-details-background: var(--swm-purple-light-100);
153+
--swm-details-foreground: var(--swm-cornflower-20);
154+
--swm-details-background: var(--swm-cornflower-100);
152155

153156
/* Admonitions */
154157
--swm-admonition-color-secondary: var(--swm-navy-light-10);
155158
--swm-admonition-color-success: var(--swm-green-light-20);
156159
--swm-admonition-color-danger: var(--swm-red-light-20);
157-
--swm-admonition-color-info: var(--swm-blue-light-20);
160+
--swm-admonition-color-info: var(--swm-cornflower-20);
158161
--swm-admonition-color-caution: var(--swm-yellow-light-20);
159162

160163
--swm-admonition-color-secondary-shadow: var(--swm-navy-light-80);
161164
--swm-admonition-color-success-shadow: var(--swm-green-light-100);
162165
--swm-admonition-color-danger-shadow: var(--swm-red-light-100);
163-
--swm-admonition-color-info-shadow: var(--swm-blue-light-100);
166+
--swm-admonition-color-info-shadow: var(--swm-cornflower-100);
164167
--swm-admonition-color-caution-shadow: var(--swm-yellow-light-100);
165168

166169
/* Details */
@@ -185,7 +188,7 @@
185188
--swm-interactive-button-color: var(--swm-navy-light-60);
186189
--swm-interactive-button-active: var(--ifm-font-color-base);
187190

188-
--swm-interactive-slider: var(--swm-blue-light-100);
191+
--swm-interactive-slider: var(--swm-cornflower-100);
189192
--swm-interactive-slider-rail: var(--swm-navy-light-20);
190193

191194
/* --swm-navy-light-100 in rgba */
@@ -201,8 +204,8 @@
201204

202205
/* Pagination */
203206
--swm-paginator-sublabel: var(--swm-navy-light-100);
204-
--swm-paginator-label: var(--swm-blue-light-80);
205-
--swm-paginator-label-hover: var(--swm-blue-light-100);
207+
--swm-paginator-label: var(--swm-cornflower-80);
208+
--swm-paginator-label-hover: var(--swm-cornflower-100);
206209

207210
/* Footer */
208211
--swm-brand-copyright-color: var(--swm-navy-light-100);
@@ -217,12 +220,12 @@
217220
--swm-searchbar-text-color: var(--swm-navy-light-60);
218221
--swm-searchbar-background: var(--swm-background);
219222
--swm-searchbar-border: var(--swm-navy-light-20);
220-
--swm-searchbar-border-hover: var(--swm-blue-light-100);
223+
--swm-searchbar-border-hover: var(--swm-cornflower-100);
221224

222-
--swm-search-hit-background: var(--swm-blue-light-20);
223-
--swm-search-hit-background-hover: var(--swm-blue-light-80);
224-
--swm-search-hit-border: var(--swm-blue-light-40);
225-
--swm-search-hit-border-hover: var(--swm-blue-light-100);
225+
--swm-search-hit-background: var(--swm-cornflower-20);
226+
--swm-search-hit-background-hover: var(--swm-cornflower-80);
227+
--swm-search-hit-border: var(--swm-cornflower-40);
228+
--swm-search-hit-border-hover: var(--swm-cornflower-100);
226229
--swm-search-hit-active-color: var(--swm-off-white);
227230

228231
--swm-docsearch-hit-source-color: var(--swm-navy-light-100);
@@ -262,11 +265,11 @@
262265
/* Cards */
263266
--swm-card-background: var(--swm-background);
264267
--swm-card-border: var(--swm-navy-light-20);
265-
--swm-card-border-hover: var(--swm-blue-light-100);
268+
--swm-card-border-hover: var(--swm-cornflower-100);
266269

267-
/* Sidebar label*/
270+
/* Sidebar label */
268271
--swm-sidebar-label-text-new: var(--swm-off-white);
269-
--swm-sidebar-label-background-new: var(--swm-blue-light-100);
272+
--swm-sidebar-label-background-new: var(--swm-cornflower-100);
270273

271274
--swm-sidebar-label-text-experimental: var(--swm-navy-light-100);
272275
--swm-sidebar-label-background-experimental: var(--swm-yellow-light-40);
@@ -279,15 +282,15 @@
279282
/* Versions dropdown */
280283
--swm-dropdown-versions-background: var(--swm-off-white);
281284
--swm-dropdown-versions-item: var(--swm-navy-light-100);
282-
--swm-dropdown-versions-item-border: var(--swm-blue-light-40);
283-
--swm-dropdown-versions-item-background: var(--swm-blue-light-20);
285+
--swm-dropdown-versions-item-border: var(--swm-cornflower-40);
286+
--swm-dropdown-versions-item-background: var(--swm-cornflower-20);
284287

285288
--swm-dropdown-versions-item-active: var(--swm-off-white);
286-
--swm-dropdown-versions-item-border-active: var(--swm-blue-light-100);
287-
--swm-dropdown-versions-item-background-active: var(--swm-blue-light-80);
289+
--swm-dropdown-versions-item-border-active: var(--swm-cornflower-100);
290+
--swm-dropdown-versions-item-background-active: var(--swm-cornflower-80);
288291

289292
--swm-dropdown-versions-item-hover: var(--swm-navy-light-100);
290-
--swm-dropdown-versions-item-active-hover: var(--swm-blue-light-100);
293+
--swm-dropdown-versions-item-active-hover: var(--swm-cornflower-100);
291294

292295
/* Version badge */
293296
--swm-version-badge: var(--swm-navy-light-100);
@@ -320,34 +323,34 @@
320323

321324
/* Tabs */
322325
--swm-tab: var(--swm-navy-light-60);
323-
--swm-tab-hover: var(--swm-blue-dark-60);
324-
--swm-tab-active: var(--swm-blue-light-80);
326+
--swm-tab-hover: var(--swm-cornflower-60);
327+
--swm-tab-active: var(--swm-cornflower-80);
325328

326329
/* Table of Contents */
327330
--ifm-toc-border-color: transparent;
328331
--ifm-toc-link-color: var(--swm-navy-light-40);
329332
--ifm-toc-link-color-active: var(--swm-off-white);
330333

331-
--swm-hire-us-toc: var(--swm-blue-light-80);
334+
--swm-hire-us-toc: var(--swm-cornflower-100);
332335
--swm-hire-us-toc-color: var(--swm-off-white);
333336
--swm-hire-us-toc-color-hover: var(--swm-navy-light-40);
334337
--swm-hire-us-toc-border-hover: var(--swm-navy-light-40);
335338

336339
/* Details section */
337-
--swm-details-foreground: var(--swm-blue-dark-120);
338-
--swm-details-background: var(--swm-blue-dark-140);
340+
--swm-details-foreground: var(--swm-cornflower-120);
341+
--swm-details-background: var(--swm-cornflower-140);
339342

340343
/* Admonitions */
341344
--swm-admonition-color-secondary: var(--swm-navy-dark-70);
342345
--swm-admonition-color-success: var(--swm-green-dark-120);
343346
--swm-admonition-color-danger: var(--swm-red-dark-120);
344-
--swm-admonition-color-info: var(--swm-blue-dark-120);
347+
--swm-admonition-color-info: var(--swm-cornflower-120);
345348
--swm-admonition-color-caution: var(--swm-yellow-dark-120);
346349

347350
--swm-admonition-color-secondary-shadow: var(--swm-navy-dark-100);
348351
--swm-admonition-color-success-shadow: var(--swm-green-dark-140);
349352
--swm-admonition-color-danger-shadow: var(--swm-red-dark-140);
350-
--swm-admonition-color-info-shadow: var(--swm-blue-dark-140);
353+
--swm-admonition-color-info-shadow: var(--swm-cornflower-140);
351354
--swm-admonition-color-caution-shadow: var(--swm-yellow-dark-140);
352355

353356
/* Details */
@@ -369,7 +372,7 @@
369372
/* Interactive Examples */
370373
--swm-interactive-button-color: var(--swm-navy-light-40);
371374

372-
--swm-interactive-slider: var(--swm-blue-light-80);
375+
--swm-interactive-slider: var(--swm-cornflower-80);
373376
--swm-interactive-slider-rail: var(--swm-navy-light-20);
374377

375378
/* --swm-navy-light-20 in rgba schema */
@@ -381,8 +384,8 @@
381384

382385
/* Pagination */
383386
--swm-paginator-sublabel: var(--swm-navy-light-20);
384-
--swm-paginator-label: var(--swm-blue-light-60);
385-
--swm-paginator-label-hover: var(--swm-blue-light-40);
387+
--swm-paginator-label: var(--swm-cornflower-60);
388+
--swm-paginator-label-hover: var(--swm-cornflower-40);
386389

387390
/* Footer */
388391
--swm-brand-copyright-color: var(--swm-navy-light-20);
@@ -394,12 +397,12 @@
394397
/* Search */
395398
--swm-searchbar-text-color: var(--swm-navy-dark-40);
396399
--swm-searchbar-border: var(--swm-navy-dark-60);
397-
--swm-searchbar-border-hover: var(--swm-blue-dark-80);
400+
--swm-searchbar-border-hover: var(--swm-cornflower-80);
398401

399-
--swm-search-hit-background: var(--swm-blue-dark-120);
400-
--swm-search-hit-background-hover: var(--swm-blue-dark-40);
401-
--swm-search-hit-border: var(--swm-blue-dark-120);
402-
--swm-search-hit-border-hover: var(--swm-blue-dark-40);
402+
--swm-search-hit-background: var(--swm-cornflower-120);
403+
--swm-search-hit-background-hover: var(--swm-cornflower-40);
404+
--swm-search-hit-border: var(--swm-cornflower-120);
405+
--swm-search-hit-border-hover: var(--swm-cornflower-40);
403406
--swm-search-hit-active-color: var(--swm-navy-light-100);
404407

405408
--swm-docsearch-hit-source-color: var(--swm-navy-light-10);
@@ -440,11 +443,11 @@
440443
/* Cards */
441444
--swm-card-background: var(--swm-navy);
442445
--swm-card-border: var(--swm-navy-dark-60);
443-
--swm-card-border-hover: var(--swm-blue-dark-80);
446+
--swm-card-border-hover: var(--swm-cornflower-80);
444447

445448
/* Sidebar label*/
446449
--swm-sidebar-label-text-new: var(--swm-off-white);
447-
--swm-sidebar-label-background-new: var(--swm-blue-dark-120);
450+
--swm-sidebar-label-background-new: var(--swm-cornflower-120);
448451

449452
--swm-sidebar-label-text-experimental: var(--swm-off-white);
450453
--swm-sidebar-label-background-experimental: var(--swm-yellow-dark-120);
@@ -458,15 +461,15 @@
458461

459462
--swm-dropdown-versions-background: var(--swm-off-navy);
460463
--swm-dropdown-versions-item: var(--swm-off-white);
461-
--swm-dropdown-versions-item-border: var(--swm-blue-dark-40);
462-
--swm-dropdown-versions-item-background: var(--swm-blue-dark-40);
464+
--swm-dropdown-versions-item-border: var(--swm-cornflower-40);
465+
--swm-dropdown-versions-item-background: var(--swm-cornflower-40);
463466

464467
--swm-dropdown-versions-item-active: var(--swm-off-white);
465-
--swm-dropdown-versions-item-border-active: var(--swm-blue-dark-120);
466-
--swm-dropdown-versions-item-background-active: var(--swm-blue-dark-120);
468+
--swm-dropdown-versions-item-border-active: var(--swm-cornflower-120);
469+
--swm-dropdown-versions-item-background-active: var(--swm-cornflower-120);
467470

468471
--swm-dropdown-versions-item-hover: var(--swm-navy-dark-100);
469-
--swm-dropdown-versions-item-active-hover: var(--swm-blue-dark-100);
472+
--swm-dropdown-versions-item-active-hover: var(--swm-cornflower-100);
470473

471474
/* Version badge */
472475
--swm-version-badge: var(--swm-off-white);

docs/src/pages/index.tsx

+4-1
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,10 @@ const Home = () => {
2323
<ExecuTorchIntroduction />
2424
<ReactNativeExecuTorchFeatures />
2525
<div className={styles.hireUsSection}>
26-
<HireUsSection href="https://swmansion.com/contact/projects?utm_source=react-native-executorch&utm_medium=docs" />
26+
<HireUsSection
27+
href="https://swmansion.com/contact/projects?utm_source=react-native-executorch&utm_medium=docs"
28+
content="React Native Core Contributors and experts in dealing with all kinds of React Native issues. Need help using React Native ExecuTorch or deploying and running AI models on your device? Let's tackle it together."
29+
/>
2730
</div>
2831
</div>
2932
</div>

docs/src/theme/TOCItems/index.js

-3
This file was deleted.

docs/src/theme/TOCItems/index.tsx

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import React from 'react';
2+
import { TOCItems } from '@swmansion/t-rex-ui';
3+
import styles from './styles.module.css';
4+
5+
const TOCItemsWrapper = ({
6+
toc,
7+
className = 'table-of-contents table-of-contents__left-border',
8+
linkClassName = 'table-of-contents__link',
9+
linkActiveClassName = undefined,
10+
minHeadingLevel: minHeadingLevelOption,
11+
maxHeadingLevel: maxHeadingLevelOption,
12+
...props
13+
}) => {
14+
return (
15+
<div className={styles.TOCItemsWrapper}>
16+
<TOCItems
17+
toc={toc}
18+
className={className}
19+
linkClassName={linkClassName}
20+
linkActiveClassName={linkActiveClassName}
21+
minHeadingLevel={minHeadingLevelOption}
22+
maxHeadingLevel={maxHeadingLevelOption}
23+
{...props}
24+
/>
25+
</div>
26+
);
27+
};
28+
29+
export default TOCItemsWrapper;
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
[data-theme='light'] .TOCItemsWrapper > div {
2+
background-color: var(--swm-cornflower-20);
3+
}

0 commit comments

Comments
 (0)