Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit d3c9a30

Browse files
Merge pull request zoltantothcom#22 from zoltantothcom/dev
Add GitHub corner instead of menu link
2 parents 1c2bb0f + aa8b32c commit d3c9a30

File tree

8 files changed

+95
-115
lines changed

8 files changed

+95
-115
lines changed

‎README.md‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,13 @@ JavaScript Design Patterns - a game to get familiar with the design patterns, te
88

99
<img src="https://raw.githubusercontent.com/zoltantothcom/JavaScript-Design-Patterns/master/static/screenshot.png?sanitize=true&raw=true" alt="JavaScript Design Patterns - game results screenshot" />
1010

11+
- [About](#about)
12+
- [How To Run Locally](#how-to-run-locally)
13+
- [Running the Tests](#running-the-tests)
14+
- [ToDo](#todo)
15+
- [Credits](#credits)
16+
- [License](#license)
17+
1118
## About
1219

1320
This is a small game to get you familiar with all the 23 Gang of Four design patterns implemented in JavaScript.
@@ -44,7 +51,7 @@ This is a small game to get you familiar with all the 23 Gang of Four design pat
4451
- Template
4552
- Visitor
4653

47-
## Run it locally
54+
## How To Run Locally
4855

4956
1. Clone this repo
5057

@@ -70,9 +77,9 @@ yarn
7077
yarn start
7178
```
7279

73-
5. Voila! The project is running on `http://localhost:8080`
80+
5. Voila! The project is running on [http://localhost:8080](http://localhost:8080)
7481

75-
## Tests
82+
## Running the Tests
7683

7784
- To run the tests
7885

@@ -86,7 +93,7 @@ yarn test
8693
yarn test:coverage
8794
```
8895

89-
## TODO
96+
## ToDo
9097

9198
- Write more unit tests
9299
- Add E2E tests (Cypress)

‎__tests__/Layout.test.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -64,8 +64,8 @@ describe('Layout', () => {
6464
expect(tree.find('Header').text()).toMatch('JavaScript Design Patterns');
6565
});
6666

67-
it('renders 3 links', () => {
68-
expect(tree.find('a')).toHaveLength(3);
67+
it('renders 2 links', () => {
68+
expect(tree.find('a')).toHaveLength(2);
6969
});
7070

7171
it('renders 2 toggle buttons', () => {
@@ -102,8 +102,8 @@ describe('Layout', () => {
102102
expect(tree.find('Header').text()).toMatch('JavaScript Design Patterns');
103103
});
104104

105-
it('renders 3 links', () => {
106-
expect(tree.find('a')).toHaveLength(3);
105+
it('renders 2 links', () => {
106+
expect(tree.find('a')).toHaveLength(2);
107107
});
108108

109109
it('renders 2 toggle buttons', () => {

‎__tests__/components/__snapshots__/Header.test.js.snap‎

Lines changed: 58 additions & 92 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

33
exports[`<Header /> component renders with DARK theme 1`] = `
4-
.c5 {
4+
.c4 {
55
background-color: #222222;
66
border: 1px solid #484848;
77
border-radius: 50%;
@@ -13,41 +13,41 @@ exports[`<Header /> component renders with DARK theme 1`] = `
1313
width: 2.5rem;
1414
}
1515
16-
.c5:hover {
16+
.c4:hover {
1717
background-color: #484848;
1818
}
1919
20-
.c5:hover svg,
21-
.c5:hover g {
20+
.c4:hover svg,
21+
.c4:hover g {
2222
fill: #ffffff;
2323
}
2424
25-
.c5.active {
25+
.c4.active {
2626
background-color: #e22a23;
2727
border-color: #e22a23;
2828
}
2929
30-
.c5.active svg,
31-
.c5.active g {
30+
.c4.active svg,
31+
.c4.active g {
3232
fill: #ffffff;
3333
}
3434
35-
.c5.light {
35+
.c4.light {
3636
background-color: #ffffff;
3737
border-color: #c4c4c4;
3838
}
3939
40-
.c5.light svg,
41-
.c5.light g {
40+
.c4.light svg,
41+
.c4.light g {
4242
fill: #707070;
4343
}
4444
45-
.c5.light:hover svg,
46-
.c5.light:hover g {
45+
.c4.light:hover svg,
46+
.c4.light:hover g {
4747
fill: #707070;
4848
}
4949
50-
.c6 {
50+
.c5 {
5151
font-family: 'Karla',sans-serif;
5252
padding: 1.5rem;
5353
border-radius: 4px;
@@ -70,10 +70,10 @@ exports[`<Header /> component renders with DARK theme 1`] = `
7070
-webkit-flex-wrap: wrap;
7171
-ms-flex-wrap: wrap;
7272
flex-wrap: wrap;
73-
-webkit-box-pack: justify;
74-
-webkit-justify-content: space-between;
75-
-ms-flex-pack: justify;
76-
justify-content: space-between;
73+
-webkit-box-pack: start;
74+
-webkit-justify-content: start;
75+
-ms-flex-pack: start;
76+
justify-content: start;
7777
margin-top: 1rem;
7878
}
7979
@@ -84,7 +84,7 @@ exports[`<Header /> component renders with DARK theme 1`] = `
8484
display: inline-flex;
8585
}
8686
87-
.c4 {
87+
.c3 {
8888
display: -webkit-inline-box;
8989
display: -webkit-inline-flex;
9090
display: -ms-inline-flexbox;
@@ -110,23 +110,13 @@ exports[`<Header /> component renders with DARK theme 1`] = `
110110
color: #f5f5f5;
111111
}
112112
113-
.c3 {
114-
border-bottom: 1px solid transparent;
115-
color: #888888;
116-
display: -webkit-inline-box;
117-
display: -webkit-inline-flex;
118-
display: -ms-inline-flexbox;
119-
display: inline-flex;
120-
font-size: 0.875rem;
121-
margin: 0.5rem 2rem 0 0;
122-
padding-bottom: 1px;
123-
-webkit-text-decoration: none;
124-
text-decoration: none;
125-
}
126-
127-
.c3:hover {
128-
border-bottom: 1px solid #f5f5f5;
129-
color: #f5f5f5;
113+
@media (min-width:769px) {
114+
.c0 {
115+
-webkit-box-pack: justify;
116+
-webkit-justify-content: space-between;
117+
-ms-flex-pack: justify;
118+
justify-content: space-between;
119+
}
130120
}
131121
132122
<div>
@@ -150,19 +140,12 @@ exports[`<Header /> component renders with DARK theme 1`] = `
150140
>
151141
About
152142
</a>
153-
<a
154-
className="c3"
155-
href="//github.com/zoltantothcom/javascript-patterns"
156-
target="_blank"
157-
>
158-
GitHub
159-
</a>
160143
</div>
161144
<div
162-
className="c4"
145+
className="c3"
163146
>
164147
<button
165-
className="c5"
148+
className="c4"
166149
onClick={[Function]}
167150
>
168151
<svg
@@ -189,7 +172,7 @@ exports[`<Header /> component renders with DARK theme 1`] = `
189172
</svg>
190173
</button>
191174
<button
192-
className="c5"
175+
className="c4"
193176
onClick={[Function]}
194177
>
195178
<svg
@@ -211,7 +194,7 @@ exports[`<Header /> component renders with DARK theme 1`] = `
211194
</button>
212195
</div>
213196
<h1
214-
className="c6"
197+
className="c5"
215198
>
216199
JavaScript Design Patterns
217200
</h1>
@@ -220,7 +203,7 @@ exports[`<Header /> component renders with DARK theme 1`] = `
220203
`;
221204

222205
exports[`<Header /> component renders with LIGHT theme 1`] = `
223-
.c5 {
206+
.c4 {
224207
background-color: #f4f4f4;
225208
border: 1px solid #e8e8e8;
226209
border-radius: 50%;
@@ -232,41 +215,41 @@ exports[`<Header /> component renders with LIGHT theme 1`] = `
232215
width: 2.5rem;
233216
}
234217
235-
.c5:hover {
218+
.c4:hover {
236219
background-color: #e8e8e8;
237220
}
238221
239-
.c5:hover svg,
240-
.c5:hover g {
222+
.c4:hover svg,
223+
.c4:hover g {
241224
fill: #ffffff;
242225
}
243226
244-
.c5.active {
227+
.c4.active {
245228
background-color: #e22a23;
246229
border-color: #e22a23;
247230
}
248231
249-
.c5.active svg,
250-
.c5.active g {
232+
.c4.active svg,
233+
.c4.active g {
251234
fill: #ffffff;
252235
}
253236
254-
.c5.light {
237+
.c4.light {
255238
background-color: #ffffff;
256239
border-color: #aaaaaa;
257240
}
258241
259-
.c5.light svg,
260-
.c5.light g {
242+
.c4.light svg,
243+
.c4.light g {
261244
fill: #cccccc;
262245
}
263246
264-
.c5.light:hover svg,
265-
.c5.light:hover g {
247+
.c4.light:hover svg,
248+
.c4.light:hover g {
266249
fill: #cccccc;
267250
}
268251
269-
.c6 {
252+
.c5 {
270253
font-family: 'Karla',sans-serif;
271254
padding: 1.5rem;
272255
border-radius: 4px;
@@ -289,10 +272,10 @@ exports[`<Header /> component renders with LIGHT theme 1`] = `
289272
-webkit-flex-wrap: wrap;
290273
-ms-flex-wrap: wrap;
291274
flex-wrap: wrap;
292-
-webkit-box-pack: justify;
293-
-webkit-justify-content: space-between;
294-
-ms-flex-pack: justify;
295-
justify-content: space-between;
275+
-webkit-box-pack: start;
276+
-webkit-justify-content: start;
277+
-ms-flex-pack: start;
278+
justify-content: start;
296279
margin-top: 1rem;
297280
}
298281
@@ -303,7 +286,7 @@ exports[`<Header /> component renders with LIGHT theme 1`] = `
303286
display: inline-flex;
304287
}
305288
306-
.c4 {
289+
.c3 {
307290
display: -webkit-inline-box;
308291
display: -webkit-inline-flex;
309292
display: -ms-inline-flexbox;
@@ -329,23 +312,13 @@ exports[`<Header /> component renders with LIGHT theme 1`] = `
329312
color: #707070;
330313
}
331314
332-
.c3 {
333-
border-bottom: 1px solid transparent;
334-
color: #e22a23;
335-
display: -webkit-inline-box;
336-
display: -webkit-inline-flex;
337-
display: -ms-inline-flexbox;
338-
display: inline-flex;
339-
font-size: 0.875rem;
340-
margin: 0.5rem 2rem 0 0;
341-
padding-bottom: 1px;
342-
-webkit-text-decoration: none;
343-
text-decoration: none;
344-
}
345-
346-
.c3:hover {
347-
border-bottom: 1px solid #707070;
348-
color: #707070;
315+
@media (min-width:769px) {
316+
.c0 {
317+
-webkit-box-pack: justify;
318+
-webkit-justify-content: space-between;
319+
-ms-flex-pack: justify;
320+
justify-content: space-between;
321+
}
349322
}
350323
351324
<div>
@@ -369,19 +342,12 @@ exports[`<Header /> component renders with LIGHT theme 1`] = `
369342
>
370343
About
371344
</a>
372-
<a
373-
className="c3"
374-
href="//github.com/zoltantothcom/javascript-patterns"
375-
target="_blank"
376-
>
377-
GitHub
378-
</a>
379345
</div>
380346
<div
381-
className="c4"
347+
className="c3"
382348
>
383349
<button
384-
className="c5"
350+
className="c4"
385351
onClick={[Function]}
386352
>
387353
<svg
@@ -408,7 +374,7 @@ exports[`<Header /> component renders with LIGHT theme 1`] = `
408374
</svg>
409375
</button>
410376
<button
411-
className="c5"
377+
className="c4"
412378
onClick={[Function]}
413379
>
414380
<svg
@@ -430,7 +396,7 @@ exports[`<Header /> component renders with LIGHT theme 1`] = `
430396
</button>
431397
</div>
432398
<h1
433-
className="c6"
399+
className="c5"
434400
>
435401
JavaScript Design Patterns
436402
</h1>

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /