Skip to content
This repository was archived by the owner on Dec 2, 2019. It is now read-only.

Commit 007890f

Browse files
author
Wendell
committed
➕ depend on @silicic/share
1 parent 36295d4 commit 007890f

File tree

6 files changed

+21
-153
lines changed

6 files changed

+21
-153
lines changed

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@
1919
"@angular/platform-browser": "~7.2.0",
2020
"@angular/platform-browser-dynamic": "~7.2.0",
2121
"@angular/router": "~7.2.0",
22+
"@silicic/share-styles": "0.0.1",
2223
"core-js": "^2.5.4",
2324
"rxjs": "~6.3.3",
2425
"tslib": "^1.9.0",

‎src/app/app.component.html‎

Lines changed: 8 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -4,33 +4,28 @@ <h1 class="header">
44
Monaco for Angular
55
</h1>
66
</header>
7-
<div class="container">
7+
<div class="content-container">
88
<section id="demo">
99
<h2 class="header">Demo</h2>
1010
<h3>Normal Editor</h3>
11-
<p class="text">
11+
<p>
1212
Render a monaco editor.
1313
</p>
1414
<div class="full-width-container">
1515
<div class="editor-container">
16-
<si-monaco-editor id="editor"
17-
[ngModel]="code"
18-
[editorOption]="editorOption"></si-monaco-editor>
16+
<si-monaco-editor id="editor" [ngModel]="code" [editorOption]="editorOption"></si-monaco-editor>
1917
</div>
2018
</div>
21-
<div class="description text">Try to type on it.</div>
19+
<p class="center"><i>Try to type on it.</i></p>
2220
<h3>Diff Editor</h3>
2321
<p class="text">
2422
Render a diff editor.
2523
</p>
2624
<div class="full-width-container">
2725
<div class="editor-container">
28-
<si-monaco-editor id="editor"
29-
[ngModel]="code"
30-
[mode]="'diff'"
31-
[originalText]="originalText"
32-
[editorOption]="{ language: 'typescript' }"
33-
(ngModelChange)="onModelChange($event)"></si-monaco-editor>
26+
<si-monaco-editor id="editor" [ngModel]="code" [mode]="'diff'" [originalText]="originalText"
27+
[editorOption]="{ language: 'typescript' }" (ngModelChange)="onModelChange($event)">
28+
</si-monaco-editor>
3429
</div>
3530
</div>
3631
</section>
@@ -64,5 +59,5 @@ <h2 class="header">License</h2>
6459
</p>
6560
</section>
6661
</div>
67-
<footer>MIT, 2019 © Wendell Hu with ❤️</footer>
62+
<footer class="footer">MIT, 2019 © Wendell Hu with ❤️</footer>
6863
</div>

‎src/app/app.component.scss‎

Lines changed: 5 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -1,91 +1,8 @@
1-
.page-container {
1+
.editor-container {
22
margin: auto;
3-
padding: 64px 16px 24px;
4-
max-width: 32rem;
5-
}
6-
7-
header {
8-
display: flex;
9-
align-items: center;
10-
11-
.header {
12-
flex-grow: 1;
13-
font-size: 24px;
14-
}
15-
16-
#avatar {
17-
height: 40px;
18-
width: 40px;
19-
border-radius: 50%;
20-
flex-grow: 0;
21-
}
22-
}
23-
24-
.container {
25-
margin: auto;
26-
width: 100%;
27-
28-
section {
29-
margin: 32px 0 56px;
30-
31-
.header {
32-
font-size: 20px;
33-
margin-bottom: 16px;
34-
}
35-
36-
.description {
37-
text-align: center;
38-
font-style: italic;
39-
}
40-
}
41-
42-
.full-width-container {
43-
margin-top: 48px;
44-
margin-bottom: 36px;
45-
}
46-
47-
@media screen and (max-width: 415px) {
48-
.full-width-container {
49-
width: 100%;
50-
overflow: scroll;
51-
52-
.editor-container {
53-
width: 100%;
54-
}
55-
}
56-
}
57-
58-
@media screen and (min-width: 415px) {
59-
.full-width-container {
60-
width: 100vw;
61-
margin-left: calc(-50vw + 50%);
62-
63-
.editor-container {
64-
width: 60%;
65-
}
66-
}
67-
}
68-
69-
.editor-container {
70-
padding: 24px;
71-
height: 400px;
72-
margin: auto;
73-
border-radius: 8px;
74-
box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
75-
}
76-
}
77-
78-
table.api-table {
3+
height: 300px;
794
width: 60%;
80-
margin: auto;
81-
}
82-
83-
footer {
84-
text-align: center;
85-
font-size: 12px;
86-
color: #7b8b9b;
87-
}
88-
89-
p.text {
90-
margin-left: 12px;
5+
padding: 20px;
6+
border-radius: 8px;
7+
box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
918
}

‎src/favicon.ico‎

-3.93 KB
Binary file not shown.

‎src/index.html‎

Lines changed: 6 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -3,22 +3,15 @@
33

44
<head>
55
<meta charset="utf-8">
6-
<title>MonacoNg</title>
6+
<title>@silicic/monaco-ng</title>
77
<base href="/">
88

9-
<meta name="viewport"
10-
content="width=device-width, initial-scale=1">
11-
<meta name="viewport"
12-
content="initial-scale=1, width=device-width, maximum-scale=1, user-scalable=0"
9+
<meta name="viewport" content="width=device-width, initial-scale=1">
10+
<meta name="viewport" content="initial-scale=1, width=device-width, maximum-scale=1, user-scalable=0"
1311
key="viewport" />
14-
<link rel="icon"
15-
type="image/x-icon"
16-
href="favicon.ico">
17-
<link rel="icon"
18-
type="image/x-icon"
19-
href="https://wendell.site/static/favicon.ico" />
20-
<link href="https://fonts.googleapis.com/css?family=Vollkorn"
21-
rel="stylesheet" />
12+
<link rel="icon" type="image/x-icon" href="favicon.ico">
13+
<link rel="icon" type="image/x-icon" href="https://wendell.site/static/favicon.ico" />
14+
<link href="https://fonts.googleapis.com/css?family=Vollkorn" rel="stylesheet" />
2215
</head>
2316

2417
<body>

‎src/styles.scss‎

Lines changed: 1 addition & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,2 @@
11
/* You can add global styles to this file, and also import other style files */
2-
3-
/* http://meyerweb.com/eric/tools/css/reset/
4-
v2.0 | 20110126
5-
License: none (public domain)
6-
*/
7-
8-
body {
9-
overflow-x: hidden;
10-
}
11-
12-
p,
13-
h1,
14-
h2,
15-
h3,
16-
h4,
17-
h5,
18-
h6,
19-
li,
20-
footer,
21-
.text {
22-
font-family: Vollkorn, 'PingFang SC', 'Helvetica', Arial;
23-
}
24-
25-
a {
26-
text-decoration: none;
27-
color: rgb(24, 120, 254);
28-
}
29-
30-
a:hover {
31-
text-decoration: underline;
32-
}
33-
34-
h2 {
35-
font-size: 24px;
36-
}
37-
38-
h3 {
39-
font-size: 18px;
40-
}
2+
@import '../node_modules/@silicic/share-styles/dist/index.css';

0 commit comments

Comments
 (0)