Skip to content

Commit 29a0bd5

Browse files
christianalfonichristianalfoni
authored
Merge pull request cerebral#146 from cerebral/websiteUpdates
docs(website): updated design
2 parents 79bc72a + 535ac39 commit 29a0bd5

File tree

18 files changed

+465
-255
lines changed

18 files changed

+465
-255
lines changed

‎packages/overmind-website/backend/index.html‎

Lines changed: 107 additions & 100 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
4-
<head>
5-
<meta charset="UTF-8">
6-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7-
<meta http-equiv="X-UA-Compatible" content="ie=edge">
8-
<link rel="shortcut icon" href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAACXBIWXMAABwgAAAcIAHND5ueAAAG
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
7+
<link
8+
rel="shortcut icon"
9+
href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAACXBIWXMAABwgAAAcIAHND5ueAAAG
910
AGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0w
1011
TXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRh
1112
LyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDAgNzkuMTYwNDUxLCAyMDE3LzA1LzA2
@@ -56,113 +57,119 @@
5657
qz0Df+FlMe1n/M+PktIxMixuIxfE7bEjI8DZ5KzoY3pBQm9hTs/QF/hOLImuKtc2iw9EH9O7qYa5
5758
XWPfi9nwq+jcKuv12Em8ItZ7ViNlPX2Df4jNzWdiWVymec1UZ8Qzx3P4UGbPII3pHf6m+PT5n7bO
5859
TianeXo65lXz9HTM6fb5vwEB1kNwNpL0bgAAAABJRU5ErkJggg=="
59-
type="image/x-icon" />
60-
<title>Overmind</title>
61-
<style>
62-
html,
63-
body {
64-
margin: 0;
65-
height: 100%;
66-
overflow: hidden;
67-
}
68-
69-
#overmind-app {
70-
height: 100%;
71-
background-color: #333;
72-
transition: background-color 0.2s ease-in, color 0.2s ease-in;
73-
overflow-y: scroll;
74-
-webkit-overflow-scrolling: touch;
75-
}
76-
77-
#overmind-loader {
78-
position: absolute;
79-
top: 0;
80-
width: 100%;
81-
display: flex;
82-
background-color: #333;
83-
height: 100%;
84-
align-items: center;
85-
justify-content: center;
86-
font-family: monospace;
87-
color: #EAEAEA;
88-
}
89-
90-
#overmind-circle {
91-
position: absolute;
92-
background-color: #EAEAEA;
93-
border-radius: 50%;
94-
width: 125px;
95-
height: 125px;
96-
box-shadow: 0 0 0 rgba(206, 206, 206, 0.4);
97-
animation: pulse 2s infinite 0.5s;
98-
}
99-
100-
#overmind-inner-circle {
101-
position: absolute;
102-
background-color: inherit;
103-
border-radius: 50%;
104-
width: 100px;
105-
height: 100px;
106-
}
60+
type="image/x-icon"
61+
/>
62+
<title>Overmind</title>
63+
<style>
64+
html,
65+
body {
66+
margin: 0;
67+
height: 100%;
68+
overflow: hidden;
69+
}
10770

108-
#overmind-text {
109-
position: absolute;
110-
text-transform: uppercase;
111-
letter-spacing: 10px;
112-
text-indent: 10px;
113-
}
71+
#overmind-app {
72+
height: 100%;
73+
background-color: #fff;
74+
transition: background-color 0.2s ease-in, color 0.2s ease-in;
75+
overflow-y: scroll;
76+
-webkit-overflow-scrolling: touch;
77+
}
11478

115-
#overmind-block {
116-
position: absolute;
117-
background-color: inherit;
118-
height: 25px;
119-
width: 125px;
120-
}
79+
#overmind-loader {
80+
position: absolute;
81+
top: 0;
82+
width: 100%;
83+
display: flex;
84+
background-color: #fff;
85+
height: 100%;
86+
align-items: center;
87+
justify-content: center;
88+
font-family: monospace;
89+
color: #eaeaea;
90+
}
12191

122-
@-webkit-keyframes pulse {
123-
0% {
124-
-webkit-box-shadow: 0 0 0 0 rgba(206, 206, 206, 0.4);
92+
#overmind-circle {
93+
position: absolute;
94+
background-color: #eaeaea;
95+
border-radius: 50%;
96+
width: 125px;
97+
height: 125px;
98+
box-shadow: 0 0 0 rgba(206, 206, 206, 0.4);
99+
animation: pulse 2s infinite 0.5s;
125100
}
126101

127-
70% {
128-
-webkit-box-shadow: 0 0 0 20px rgba(211, 211, 211, 0);
102+
#overmind-inner-circle {
103+
position: absolute;
104+
background-color: inherit;
105+
border-radius: 50%;
106+
width: 100px;
107+
height: 100px;
129108
}
130109

131-
100% {
132-
-webkit-box-shadow: 0 0 0 0 rgba(199, 199, 199, 0);
110+
#overmind-text {
111+
position: absolute;
112+
text-transform: uppercase;
113+
letter-spacing: 10px;
114+
text-indent: 10px;
133115
}
134-
}
135116

136-
@keyframes pulse {
137-
0% {
138-
-moz-box-shadow: 0 0 0 0 rgba(201, 201, 201, 0.4);
139-
box-shadow: 0 0 0 0 rgba(196, 196, 196, 0.4);
117+
#overmind-block {
118+
position: absolute;
119+
background-color: inherit;
120+
height: 25px;
121+
width: 125px;
140122
}
141123

142-
70% {
143-
-moz-box-shadow: 0 0 0 20px rgba(202, 202, 202, 0);
144-
box-shadow: 0 0 0 20px rgba(209, 209, 209, 0);
124+
@-webkit-keyframes pulse {
125+
0% {
126+
-webkit-box-shadow: 0 0 0 0 rgba(206, 206, 206, 0.4);
127+
}
128+
129+
70% {
130+
-webkit-box-shadow: 0 0 0 20px rgba(211, 211, 211, 0);
131+
}
132+
133+
100% {
134+
-webkit-box-shadow: 0 0 0 0 rgba(199, 199, 199, 0);
135+
}
145136
}
146137

147-
100% {
148-
-moz-box-shadow: 0 0 0 0 rgba(206, 206, 206, 0);
149-
box-shadow: 0 0 0 0 rgba(202, 202, 202, 0);
138+
@keyframes pulse {
139+
0% {
140+
-moz-box-shadow: 0 0 0 0 rgba(201, 201, 201, 0.4);
141+
box-shadow: 0 0 0 0 rgba(196, 196, 196, 0.4);
142+
}
143+
144+
70% {
145+
-moz-box-shadow: 0 0 0 20px rgba(202, 202, 202, 0);
146+
box-shadow: 0 0 0 20px rgba(209, 209, 209, 0);
147+
}
148+
149+
100% {
150+
-moz-box-shadow: 0 0 0 0 rgba(206, 206, 206, 0);
151+
box-shadow: 0 0 0 0 rgba(202, 202, 202, 0);
152+
}
150153
}
151-
}
152-
</style>
153-
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">
154-
<link href="https://fonts.googleapis.com/css?family=Nunito:400,700" rel="stylesheet">
155-
</head>
154+
</style>
155+
<link
156+
href="https://fonts.googleapis.com/css?family=Source+Code+Pro"
157+
rel="stylesheet"
158+
/>
159+
<link
160+
href="https://fonts.googleapis.com/css?family=Nunito:400,700"
161+
rel="stylesheet"
162+
/>
163+
</head>
156164

157-
<body>
158-
<div id="overmind-app">
159-
<div id="overmind-loader">
160-
<div id="overmind-circle"></div>
161-
<div id="overmind-inner-circle"></div>
162-
<div id="overmind-block"></div>
163-
<div id="overmind-text">overmind</div>
165+
<body>
166+
<div id="overmind-app">
167+
<div id="overmind-loader">
168+
<div id="overmind-circle"></div>
169+
<div id="overmind-inner-circle"></div>
170+
<div id="overmind-block"></div>
171+
<div id="overmind-text">overmind</div>
172+
</div>
164173
</div>
165-
</div>
166-
</body>
167-
168-
</html>
174+
</body>
175+
</html>

‎packages/overmind-website/examples/frontpage/actions.ts‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
export default () => [
2+
{
3+
code: `
4+
export const getItems = async ({ state, request }) => {
5+
state.isLoadingItems = true
6+
state.items = await request("/items")
7+
state.isLoadingItems = false
8+
}
9+
`,
10+
},
11+
]

‎packages/overmind-website/examples/frontpage/operators.ts‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
export default () => [
2+
{
3+
code: `
4+
export const search = pipe(
5+
setQuery,
6+
filterValidQuery,
7+
debounce(200),
8+
getResult,
9+
catchResultError,
10+
setResult
11+
)
12+
`,
13+
},
14+
]

‎packages/overmind-website/examples/frontpage/statetree.ts‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
export default (ts) => [
2+
{
3+
code: `
4+
{
5+
isLoadingApp: false,
6+
posts: {
7+
list: [],
8+
selectedPost: null,
9+
isLoadingPosts: false
10+
},
11+
user: null
12+
}
13+
`,
14+
},
15+
]

‎packages/overmind-website/examples/frontpage/typings.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export default () => [
2+
{
3+
code: `
4+
export const getItems: Action = ({ state }) => {
5+
state.title = true // TS Error: Should be string
6+
}
7+
`,
8+
},
9+
]

‎packages/overmind-website/src/components/Api/elements.tsx‎

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ export const Wrapper = styled.div`
77

88
export const ListWrapper = styled.div`
99
position: fixed;
10-
top: 0;
10+
top: 35px;
1111
z-index: 1;
1212
box-sizing: border-box;
1313
width: 150px;
@@ -26,9 +26,9 @@ export const List = styled.ul`
2626
a {
2727
text-decoration: none;
2828
display: block;
29-
color: ${({ theme }) => theme.color.white};
29+
color: ${({ theme }) => theme.color.black};
3030
:hover {
31-
color: #fff;
31+
color: ${({ theme }) => theme.color.dark};
3232
}
3333
}
3434
`
@@ -40,11 +40,9 @@ export const Item = styled<
4040
'li'
4141
>('li')`
4242
padding: ${({ theme }) => `${theme.padding.smaller} ${theme.padding.small}`};
43-
color: ${({ theme }) => theme.color.white};
43+
color: ${({ theme }) => theme.color.primary};
4444
border-left: 2px solid
4545
${({ theme, selected }) => (selected ? theme.color.primary : 'transparent')};
46-
background-color: ${({ theme, selected }) =>
47-
selected ? theme.color.lighten(theme.color.dark, 0.2) : 'transparent'};
4846
`
4947

5048
export const TocList = styled.ul`

0 commit comments

Comments
 (0)