Skip to content
This repository was archived by the owner on Nov 16, 2022. It is now read-only.

Commit 665fa18

Browse files
DanilAndreevDanilAndreev
committed
[Code showers] Added tutorial.
1 parent 8326d4f commit 665fa18

File tree

13 files changed

+222
-38
lines changed

13 files changed

+222
-38
lines changed

‎src/Documentation.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,7 @@ import RCDEReactComponentApiPageAPI
6666
import RCDEStyleAPI from "./pages/Extensions/ReactComponentsDocsExtension/APIs/StyleAPI";
6767
import ReactComponentApiPageDemo
6868
from "./pages/Extensions/ReactComponentsDocsExtension/Components/ReactComponentApiPageDemo";
69+
import CodeDemo from "./pages/Components/Code";
6970

7071

7172
export default function Documentation() {
@@ -107,6 +108,7 @@ export default function Documentation() {
107108
<Installation/>
108109
</PagesGroup>
109110
<PagesGroup name={"Components"}>
111+
<CodeDemo/>
110112
<ListsDemo/>
111113
<LayoutDemo/>
112114
<HeadersDemo/>
@@ -165,6 +167,9 @@ export default function Documentation() {
165167
</PagesGroup>
166168
</PagesGroup>
167169
</PagesGroup>
170+
<PagesGroup name={"System"}>
171+
172+
</PagesGroup>
168173
</DocsPages>
169174
</DocsLayout>
170175
);

‎src/examples/Code/Code.js‎

Lines changed: 0 additions & 8 deletions
This file was deleted.

‎src/examples/Code/CodeExample.js‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
/*
2+
* Author: Andrieiev Danil | danssg08@gmail.com | https://github.com/DanilAndreev
3+
* Copyright (C) 2020.
4+
*/
5+
6+
import React from "react";
7+
import Code from "@material-docs/core/components/Code";
8+
9+
const code = `
10+
function test() {
11+
console.log("Hello world!");
12+
console.log("I am a Code element.");
13+
}
14+
`.trim();
15+
16+
export default function CodeExample() {
17+
return (
18+
<Code theme={"darcula"} language={"javascript"}>
19+
{code}
20+
</Code>
21+
);
22+
}

‎src/examples/Code/DemoWithCodeExpample.js‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
/*
2+
* Author: Andrieiev Danil | danssg08@gmail.com | https://github.com/DanilAndreev
3+
* Copyright (C) 2020.
4+
*/
5+
6+
import React from "react";
7+
import DemoWithCode from "@material-docs/core/components/DemoWithCode";
8+
9+
function Component () {
10+
return (
11+
<div style={{padding: 30}}>
12+
I am a test component
13+
<br />
14+
<br />
15+
And I displayed in 2 DemoWithCode blocks.
16+
</div>
17+
);
18+
}
19+
20+
const code = `
21+
function Component () {
22+
return (
23+
<div style={{padding: 30}}>
24+
I am a test component
25+
<br />
26+
<br />
27+
And I displayed in 2 DemoWithCode blocks.
28+
</div>
29+
);
30+
}
31+
`.trim();
32+
33+
export default function DemoWithCodeExample() {
34+
return (
35+
<DemoWithCode
36+
name={"I am a DemoWithCode component"}
37+
theme={"darcula"}
38+
code={code}
39+
paperContainer
40+
>
41+
<Component />
42+
</DemoWithCode>
43+
);
44+
}

‎src/examples/Code/ExpansionCodeExample.js‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
/*
2+
* Author: Andrieiev Danil | danssg08@gmail.com | https://github.com/DanilAndreev
3+
* Copyright (C) 2020.
4+
*/
5+
6+
7+
import React from "react";
8+
import ExpansionCode from "@material-docs/core/components/ExpansionCode";
9+
10+
const code = `
11+
function test() {
12+
console.log("Hello world?");
13+
console.log("Yes, hello!");
14+
15+
console.log("I am Material Docs framework :)");
16+
17+
for (let i = 0; i < 20; i++) {
18+
console.log("Huuuuraaaa! \n");
19+
}
20+
21+
return null;
22+
}
23+
`.trim();
24+
25+
export default function ExpansionCodeExample() {
26+
return (
27+
<ExpansionCode
28+
name={"My name is ExpansionCode"}
29+
noTag
30+
theme={"darcula"}
31+
language={"javascript"}
32+
>
33+
{code}
34+
</ExpansionCode>
35+
);
36+
}

‎src/examples/Code/code.md‎

Whitespace-only changes.

‎src/examples/Code/codeExample.md‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import React from "react";
2+
import Code from "@material-docs/core/components/Code";
3+
4+
const code = `
5+
function test() {
6+
console.log("Hello world!");
7+
console.log("I am a Code element.");
8+
}
9+
`.trim();
10+
11+
export default function CodeExample() {
12+
return (
13+
<Code theme={"darcula"} language={"javascript"}>
14+
{code}
15+
</Code>
16+
);
17+
}

‎src/examples/Code/expansionCodeExample.md‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import React from "react";
2+
import ExpansionCode from "@material-docs/core/components/ExpansionCode";
3+
4+
const code = `
5+
function test() {
6+
console.log("Hello world?");
7+
console.log("Yes, hello!");
8+
9+
console.log("I am Material Docs framework :)");
10+
11+
for (let i = 0; i < 20; i++) {
12+
console.log("Huuuuraaaa! \n");
13+
}
14+
15+
return null;
16+
}
17+
`.trim();
18+
19+
export default function ExpansionCodeExample() {
20+
return (
21+
<ExpansionCode
22+
name={"My name is ExpansionCode"}
23+
noTag
24+
theme={"darcula"}
25+
language={"javascript"}
26+
>
27+
{code}
28+
</ExpansionCode>
29+
);
30+
}

‎src/locale/EN.json‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,12 @@
33
"label": "English",
44
"locale": {
55
"pages": {
6+
"CodeDemo": {
7+
"searchDescription": "",
8+
"searchTags": {
9+
10+
}
11+
},
612
"ImagesDemo": {
713
"pageAbout": "Pictures are needed in order to visually demonstrate some information",
814
"infoBlock": "You don't have to worry about page loading speed due to large images. The __Image__ component supports __lazy loading__ technology."
@@ -858,8 +864,6 @@
858864
"page": "page",
859865
"preset": "preset"
860866
}
861-
862-
863867
},
864868
"RCDEPropAPI": {
865869
"searchDescription": "API documentation of the RCDE Prop component.",

‎src/pages/APIs/CodeAPI/index.js‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,11 @@
44
*/
55

66
import React from "react";
7-
import {Link} from "@material-ui/core";
8-
97
import {H2, List, ListItem, useLang} from "@material-docs/core";
108
import ApiPage from "../../../components/ApiPage";
119

1210
import importCode from "./importCode.md";
11+
import Link from "@material-docs/core/components/Link";
1312

1413
export default function CodeAPI() {
1514
const {lang} = useLang();
@@ -33,7 +32,7 @@ export default function CodeAPI() {
3332
>
3433
<H2>Demos</H2>
3534
<List>
36-
<ListItem><Link>Code showing</Link></ListItem>
35+
<ListItem><Link page={["Components", "Code showers"]}>Code showing</Link></ListItem>
3736
</List>
3837
</ApiPage>
3938
);

0 commit comments

Comments
 (0)