Skip to content

Commit a843cf1

Browse files
committed
Update homepage
1 parent 6da9597 commit a843cf1

File tree

5 files changed

+118
-86
lines changed

5 files changed

+118
-86
lines changed

package-lock.json

Lines changed: 0 additions & 15 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,6 @@
6666
"husky": "^2.3.0",
6767
"jest": "^24.8.0",
6868
"markdown-toc": "^1.2.0",
69-
"milligram": "^1.3.0",
7069
"mini-css-extract-plugin": "^0.6.0",
7170
"mkdirp": "^0.5.1",
7271
"npm-run-all": "^4.1.5",

src/front/index.html

Lines changed: 73 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -1,59 +1,81 @@
11
<html>
2+
<head>
3+
<link
4+
rel="stylesheet"
5+
href="https://use.fontawesome.com/releases/v5.8.2/css/all.css"
6+
integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay"
7+
crossorigin="anonymous"
8+
/>
9+
<title>JSON Server</title>
10+
</head>
211

3-
<head>
4-
<title>JSON Server</title>
5-
</head>
12+
<body>
13+
<header>
14+
<div class="container">
15+
<nav>
16+
<ul>
17+
<li class="title">
18+
JSON Server
19+
</li>
20+
<li>
21+
<a href="https://www.patreon.com/typicode">
22+
<i class="fab fa-patreon"></i>Patreon
23+
</a>
24+
</li>
25+
<li>
26+
<a href="https://thanks.typicode.com">
27+
<i class="far fa-laugh"></i>Supporters
28+
</a>
29+
</li>
30+
<li>
31+
<a href="https://my-json-server.typicode.com">
32+
<i class="fas fa-burn"></i>My JSON Server
33+
</a>
34+
</li>
35+
</ul>
36+
</nav>
37+
</div>
38+
</header>
39+
<main>
40+
<div class="container">
41+
<h1>Congrats!</h1>
42+
<p>
43+
You're successfully running JSON Server
44+
<br />
45+
✧*。٩(ˊᗜˋ*)و✧*。
46+
</p>
647

7-
<body>
8-
<header>
9-
<div class="container">
10-
<h3>JSON Server</h3>
11-
</div>
12-
</header>
13-
<main>
14-
<div class="container">
15-
<h4>Congrats!</h4>
16-
<p>
17-
You're successfully running JSON Server
18-
<br> ✧*。٩(ˊᗜˋ*)و✧*。
19-
</p>
48+
<div id="resources"></div>
2049

21-
<div id="resources"></div>
50+
<p>
51+
To access and modify resources, you can use any HTTP method
52+
<br />
53+
<code>GET</code>
54+
<code>POST</code>
55+
<code>PUT</code>
56+
<code>PATCH</code>
57+
<code>DELETE</code>
58+
<code>OPTIONS</code>
59+
</p>
2260

23-
<p>
24-
To access and modify resources, you can use any HTTP method
25-
<br>
26-
<code>GET</code>
27-
<code>POST</code>
28-
<code>PUT</code>
29-
<code>PATCH</code>
30-
<code>DELETE</code>
31-
<code>OPTIONS</code>
32-
</p>
61+
<div id="custom-routes"></div>
3362

34-
<div id="custom-routes"></div>
63+
<h1>Documentation</h1>
64+
<p>
65+
<a href="https://github.com/typicode/json-server">
66+
<i class="fab fa-github-alt"></i>README
67+
</a>
68+
</p>
69+
</div>
70+
</main>
3571

36-
<h4>Documentation</h4>
37-
<p>
38-
View
39-
<a href="https://github.com/typicode/json-server">README</a>
40-
</p>
41-
42-
<h4>See also</h4>
43-
<ul>
44-
<li><a href="https://www.patreon.com/typicode">Patreon</a></li>
45-
<li><a href="https://thanks.typicode.com">Supporters</a></li>
46-
</ul>
47-
</div>
48-
</main>
49-
50-
<footer>
51-
<div class="container">
52-
<p>
53-
To replace this page, create a
54-
<code>./public/index.html</code> file.
55-
</p>
56-
</div>
57-
</footer>
58-
</body>
72+
<footer>
73+
<div class="container">
74+
<p>
75+
To replace this page, create a
76+
<code>./public/index.html</code> file.
77+
</p>
78+
</div>
79+
</footer>
80+
</body>
5981
</html>

src/front/index.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import 'promise-polyfill/src/polyfill'
22
import 'whatwg-fetch'
3-
import 'milligram/dist/milligram.css'
43
import './style.css'
54

65
function ResourceItem({ name, length }) {
@@ -34,7 +33,7 @@ function NoResources() {
3433
function ResourcesBlock({ db }) {
3534
return `
3635
<div>
37-
<h4>Resources</h4>
36+
<h1>Resources</h1>
3837
${Object.keys(db).length ? ResourceList({ db }) : NoResources()}
3938
</div>
4039
`
@@ -53,7 +52,7 @@ function CustomRoutesBlock({ customRoutes }) {
5352
if (rules.length) {
5453
return `
5554
<div>
56-
<h4>Custom Routes</h4>
55+
<h1>Custom Routes</h1>
5756
<table>
5857
${rules
5958
.map(

src/front/style.css

Lines changed: 43 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,63 @@
1-
html {
2-
font-size: 70%;
3-
}
4-
51
body {
62
display: flex;
73
min-height: 100vh;
8-
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
4+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
5+
Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
96
flex-direction: column;
10-
padding:0;
7+
padding: 0;
118
margin: 0;
129
color: #333;
1310
letter-spacing: 0;
1411
}
1512

13+
.container {
14+
max-width: 960px;
15+
margin: auto;
16+
padding: 1rem;
17+
}
18+
1619
header {
17-
padding-top: 2.0rem;
18-
border-bottom: 1px solid #EEE;
20+
border-bottom: 1px solid #eee;
1921
}
2022

21-
header a, header a:hover {
23+
header a,
24+
header a:hover {
2225
text-decoration: none;
2326
}
2427

28+
nav ul {
29+
display: flex;
30+
flex-wrap: nowrap;
31+
justify-content: space-between;
32+
}
33+
34+
nav li.title {
35+
flex-grow: 5;
36+
text-align: left;
37+
font-weight: bold;
38+
}
39+
40+
nav li {
41+
flex-grow: 1;
42+
text-align: right;
43+
}
44+
2545
main {
2646
flex: 1;
2747
}
2848

2949
footer {
30-
padding-top: 2.5rem;
31-
border-top: 1px solid #EEE;
50+
margin-top: 4rem;
51+
border-top: 1px solid #eee;
3252
}
3353

34-
h4 {
54+
h1 {
3555
margin-top: 4rem;
56+
font-weight: normal;
57+
}
58+
59+
i {
60+
margin-right: 0.5rem;
3661
}
3762

3863
a {
@@ -50,8 +75,7 @@ table {
5075

5176
td {
5277
border: 0;
53-
padding: 0 1em .5em 0;
54-
font-weight: 300;
78+
padding: 0 1em 0.5em 0;
5579
}
5680

5781
td:first-child {
@@ -66,9 +90,12 @@ ul {
6690

6791
li {
6892
list-style-type: none;
69-
margin-bottom: .2rem;
93+
margin-bottom: 0.2rem;
7094
}
7195

7296
code {
73-
border-radius: 0;
97+
padding: 0.2rem;
98+
margin: 0rem 0.2rem;
99+
border-radius: 0.2rem;
100+
background: #eee;
74101
}

0 commit comments

Comments
 (0)