Skip to content

Commit da1a513

Browse files
leogsouzaleogsouza
committed
Merge remote-tracking branch 'wesbos/master'
2 parents adaff5b + 2bc30a0 commit da1a513

File tree

34 files changed

+128
-97
lines changed

34 files changed

+128
-97
lines changed

‎.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,4 @@
22
node_modules/
33
*.log
44
haters/
5+
.idea/

‎01 - JavaScript Drum Kit/style.css

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
html {
22
font-size: 10px;
3-
background:url(http://i.imgur.com/b9r5sEL.jpg) bottom center;
3+
background: url(http://i.imgur.com/b9r5sEL.jpg) bottom center;
44
background-size: cover;
55
}
66
body,html {
@@ -10,41 +10,41 @@ body,html {
1010
}
1111

1212
.keys {
13-
display:flex;
14-
flex:1;
15-
min-height:100vh;
13+
display: flex;
14+
flex: 1;
15+
min-height: 100vh;
1616
align-items: center;
1717
justify-content: center;
1818
}
1919

2020
.key {
21-
border:4px solid black;
22-
border-radius:5px;
23-
margin:1rem;
21+
border: .4rem solid black;
22+
border-radius: .5rem;
23+
margin: 1rem;
2424
font-size: 1.5rem;
25-
padding:1rem .5rem;
26-
transition:all .07s;
27-
width:100px;
25+
padding: 1rem .5rem;
26+
transition: all .07s ease;
27+
width: 10rem;
2828
text-align: center;
29-
color:white;
30-
background:rgba(0,0,0,0.4);
31-
text-shadow:0 0 5px black;
29+
color: white;
30+
background: rgba(0,0,0,0.4);
31+
text-shadow: 0 0 .5rem black;
3232
}
3333

3434
.playing {
35-
transform:scale(1.1);
36-
border-color:#ffc600;
37-
box-shadow: 0 0 10px #ffc600;
35+
transform: scale(1.1);
36+
border-color: #ffc600;
37+
box-shadow: 0 0 1rem #ffc600;
3838
}
3939

4040
kbd {
4141
display: block;
42-
font-size: 40px;
42+
font-size: 4rem;
4343
}
4444

4545
.sound {
4646
font-size: 1.2rem;
4747
text-transform: uppercase;
48-
letter-spacing: 1px;
49-
color:#ffc600;
48+
letter-spacing: .1rem;
49+
color: #ffc600;
5050
}

‎02 - JS + CSS Clock/index-FINISHED.html renamed to ‎02 - JS and CSS Clock/index-FINISHED.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@
2626
}
2727

2828
body {
29+
margin: 0;
2930
font-size: 2rem;
3031
display:flex;
3132
flex:1;

‎02 - JS + CSS Clock/index-START.html renamed to ‎02 - JS and CSS Clock/index-START.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@
2626
}
2727

2828
body {
29+
margin: 0;
2930
font-size: 2rem;
3031
display:flex;
3132
flex:1;

‎03 - CSS Variables/index-FINISHED.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,13 @@ <h2>Update CSS Variables with <span class='hl'>JS</span></h2>
99

1010
<div class="controls">
1111
<label for="spacing">Spacing:</label>
12-
<input type="range" name="spacing" min="10" max="200" value="10" data-sizing="px">
12+
<input id="spacing" type="range" name="spacing" min="10" max="200" value="10" data-sizing="px">
1313

1414
<label for="blur">Blur:</label>
15-
<input type="range" name="blur" min="0" max="25" value="10" data-sizing="px">
15+
<input id="blur" type="range" name="blur" min="0" max="25" value="10" data-sizing="px">
1616

1717
<label for="base">Base Color</label>
18-
<input type="color" name="base" value="#ffc600">
18+
<input id="base" type="color" name="base" value="#ffc600">
1919
</div>
2020

2121
<img src="https://source.unsplash.com/7bwQXzbF6KE/800x500">

‎03 - CSS Variables/index-START.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,13 @@ <h2>Update CSS Variables with <span class='hl'>JS</span></h2>
99

1010
<div class="controls">
1111
<label for="spacing">Spacing:</label>
12-
<input type="range" name="spacing" min="10" max="200" value="10" data-sizing="px">
12+
<input id="spacing" type="range" name="spacing" min="10" max="200" value="10" data-sizing="px">
1313

1414
<label for="blur">Blur:</label>
15-
<input type="range" name="blur" min="0" max="25" value="10" data-sizing="px">
15+
<input id="blur" type="range" name="blur" min="0" max="25" value="10" data-sizing="px">
1616

1717
<label for="base">Base Color</label>
18-
<input type="color" name="base" value="#ffc600">
18+
<input id="base" type="color" name="base" value="#ffc600">
1919
</div>
2020

2121
<img src="https://source.unsplash.com/7bwQXzbF6KE/800x500">

‎04 - Array Cardio Day 1/index-START.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
{ first: 'Hanna', last: 'Hammarström', year: 1829, passed: 1909 }
2828
];
2929

30-
const people = ['Beck, Glenn', 'Becker, Carl', 'Beckett, Samuel', 'Beddoes, Mick', 'Beecher, Henry', 'Beethoven, Ludwig', 'Begin, Menachem', 'Belloc, Hilaire', 'Bellow, Saul', 'Benchley, Robert', 'Benenson, Peter', 'Ben-Gurion, David', 'Benjamin, Walter', 'Benn, Tony', 'Bennington, Chester', 'Benson, Leana', 'Bent, Silas', 'Bentsen, Lloyd', 'Berger, Ric', 'Bergman, Ingmar', 'Berio, Luciano', 'Berle, Milton', 'Berlin, Irving', 'Berne, Eric', 'Bernhard, Sandra', 'Berra, Yogi', 'Berry, Halle', 'Berry, Wendell', 'Bethea, Erin', 'Bevan, Aneurin', 'Bevel, Ken', 'Biden, Joseph', 'Bierce, Ambrose', 'Biko, Steve', 'Billings, Josh', 'Biondo, Frank', 'Birrell, Augustine', 'Black Elk', 'Blair, Robert', 'Blair, Tony', 'Blake, William'];
30+
const people = ['Beck, Glenn', 'Becker, Carl', 'Beckett, Samuel', 'Beddoes, Mick', 'Beecher, Henry', 'Beethoven, Ludwig', 'Begin, Menachem', 'Belloc, Hilaire', 'Bellow, Saul', 'Benchley, Robert', 'Benenson, Peter', 'Ben-Gurion, David', 'Benjamin, Walter', 'Benn, Tony', 'Bennington, Chester', 'Benson, Leana', 'Bent, Silas', 'Bentsen, Lloyd', 'Berger, Ric', 'Bergman, Ingmar', 'Berio, Luciano', 'Berle, Milton', 'Berlin, Irving', 'Berne, Eric', 'Bernhard, Sandra', 'Berra, Yogi', 'Berry, Halle', 'Berry, Wendell', 'Bethea, Erin', 'Bevan, Aneurin', 'Bevel, Ken', 'Biden, Joseph', 'Bierce, Ambrose', 'Biko, Steve', 'Billings, Josh', 'Biondo, Frank', 'Birrell, Augustine', 'Black, Elk', 'Blair, Robert', 'Blair, Tony', 'Blake, William'];
3131

3232
// Array.prototype.filter()
3333
// 1. Filter the list of inventors for those who were born in the 1500's

‎05 - Flex Panel Gallery/index-FINISHED.html

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -86,11 +86,6 @@
8686
font-size:40px;
8787
}
8888

89-
.cta {
90-
color:white;
91-
text-decoration: none;
92-
}
93-
9489
</style>
9590

9691

‎05 - Flex Panel Gallery/index-START.html

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -70,11 +70,6 @@
7070
font-size:40px;
7171
}
7272

73-
.cta {
74-
color:white;
75-
text-decoration: none;
76-
}
77-
7873
</style>
7974

8075

‎06 - Type Ahead/style.css

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -66,20 +66,10 @@
6666
font-size: 15px;
6767
}
6868

69-
70-
.details {
71-
text-align: center;
72-
font-size: 15px;
73-
}
74-
7569
.hl {
7670
background:#ffc600;
7771
}
7872

79-
.love {
80-
text-align: center;
81-
}
82-
8373
a {
8474
color:black;
8575
background:rgba(0,0,0,0.1);

‎10 - Hold Shift and Check Checkboxes/index-FINISHED.html

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8">
5-
<title>Document</title>
5+
<title>Hold Shift to Check Multiple Checkboxes</title>
66
</head>
77
<body>
88
<style>
@@ -51,11 +51,6 @@
5151
border-left: 1px solid #D1E2FF;
5252
}
5353

54-
.details {
55-
text-align: center;
56-
font-size: 15px;
57-
}
58-
5954

6055
</style>
6156
<!--

‎10 - Hold Shift and Check Checkboxes/index-START.html

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8">
5-
<title>Document</title>
5+
<title>Hold Shift to Check Multiple Checkboxes</title>
66
</head>
77
<body>
88
<style>
@@ -51,11 +51,6 @@
5151
border-left: 1px solid #D1E2FF;
5252
}
5353

54-
.details {
55-
text-align: center;
56-
font-size: 15px;
57-
}
58-
5954

6055
</style>
6156
<!--

‎11 - Custom Video Player/style.css

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ html {
77
}
88

99
body {
10+
margin: 0;
1011
padding: 0;
1112
display:flex;
1213
background:#7A419B;
@@ -26,6 +27,17 @@ body {
2627
overflow: hidden;
2728
}
2829

30+
/* This css is only applied when fullscreen is active. */
31+
.player:fullscreen {
32+
max-width: none;
33+
width: 100%;
34+
}
35+
36+
.player:-webkit-full-screen {
37+
max-width: none;
38+
width: 100%;
39+
}
40+
2941
.player__video {
3042
width: 100%;
3143
}
@@ -113,7 +125,6 @@ input[type=range]::-webkit-slider-runnable-track {
113125
border: 0.2px solid rgba(1, 1, 1, 0);
114126
}
115127
input[type=range]::-webkit-slider-thumb {
116-
box-shadow: 0 0 0 rgba(0, 0, 0, 0), 0 0 0 rgba(13, 13, 13, 0);
117128
height: 15px;
118129
width: 15px;
119130
border-radius: 50px;
@@ -123,7 +134,7 @@ input[type=range]::-webkit-slider-thumb {
123134
margin-top: -3.5px;
124135
box-shadow:0 0 2px rgba(0,0,0,0.2);
125136
}
126-
input[type=range]:focus::-wefbkit-slider-runnable-track {
137+
input[type=range]:focus::-webkit-slider-runnable-track {
127138
background: #bada55;
128139
}
129140
input[type=range]::-moz-range-track {

‎14 - JavaScript References VS Copying/index-START.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@
2626

2727
// So, how do we fix this? We take a copy instead!
2828

29-
// one day
29+
// one way
3030

3131
// or create a new array and concat the old one in
3232

‎16 - Mouse Move Shadow/index-finished.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,10 @@ <h1 contenteditable>🔥WOAH!</h1>
1616
font-family: sans-serif;
1717
}
1818

19+
body {
20+
margin: 0;
21+
}
22+
1923
.hero {
2024
min-height: 100vh;
2125
display:flex;

‎16 - Mouse Move Shadow/index-start.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,10 @@ <h1 contenteditable>🔥WOAH!</h1>
1616
font-family: sans-serif;
1717
}
1818

19+
body {
20+
margin: 0;
21+
}
22+
1923
.hero {
2024
min-height: 100vh;
2125
display:flex;

‎17 - Sort Without Articles/index-FINISHED.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88

99
<style>
1010
body {
11+
margin: 0;
1112
font-family: sans-serif;
1213
background: url("https://source.unsplash.com/nDqA4d5NL0k/2000x2000");
1314
background-size: cover;

‎17 - Sort Without Articles/index-START.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88

99
<style>
1010
body {
11+
margin: 0;
1112
font-family: sans-serif;
1213
background: url("https://source.unsplash.com/nDqA4d5NL0k/2000x2000");
1314
background-size: cover;

‎18 - Adding Up Times with Reduce/index-FINISHED.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -180,7 +180,7 @@
180180
<li data-time="4:04">
181181
Video 58
182182
</li>
183-
183+
</ul>
184184
<script>
185185

186186
const timeNodes = Array.from(document.querySelectorAll('[data-time]'));

‎18 - Adding Up Times with Reduce/index-START.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -180,7 +180,7 @@
180180
<li data-time="4:04">
181181
Video 58
182182
</li>
183-
183+
</ul>
184184
<script>
185185
</script>
186186
</body>

‎19 - Webcam Fun/scripts-FINISHED.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ function getVideo() {
1616
});
1717
}
1818

19-
function paintToCanavas() {
19+
function paintToCanvas() {
2020
const width = video.videoWidth;
2121
const height = video.videoHeight;
2222
canvas.width = width;
@@ -99,4 +99,4 @@ function greenScreen(pixels) {
9999

100100
getVideo();
101101

102-
video.addEventListener('canplay', paintToCanavas);
102+
video.addEventListener('canplay', paintToCanvas);

‎19 - Webcam Fun/style.css

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -52,8 +52,8 @@ html {
5252
background:white;
5353
}
5454

55-
.strip a:nth-child(5n+1) img { rotate: 10deg; }
56-
.strip a:nth-child(5n+2) img { rotate: -2deg; }
57-
.strip a:nth-child(5n+3) img { rotate: 8deg; }
58-
.strip a:nth-child(5n+4) img { rotate: -11deg; }
59-
.strip a:nth-child(5n+5) img { rotate: 12deg; }
55+
.strip a:nth-child(5n+1) img { transform: rotate(10deg); }
56+
.strip a:nth-child(5n+2) img { transform: rotate(-2deg); }
57+
.strip a:nth-child(5n+3) img { transform: rotate(8deg); }
58+
.strip a:nth-child(5n+4) img { transform: rotate(-11deg); }
59+
.strip a:nth-child(5n+5) img { transform: rotate(12deg); }

‎20 - Speech Detection/index-FINISHED.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@
6666
line-height:3rem;
6767
}
6868
p {
69-
margin: 0 0 3rem 0;
69+
margin: 0 0 3rem;
7070
}
7171

7272
.words:before {

‎20 - Speech Detection/index-START.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@
4141
line-height:3rem;
4242
}
4343
p {
44-
margin: 0 0 3rem 0;
44+
margin: 0 0 3rem;
4545
}
4646

4747
.words:before {

‎21 - Geolocation/index-FINISHED.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ <h1 class="speed">
1919
font-size: 100px;
2020
}
2121
body {
22+
margin: 0;
2223
font-family: sans-serif;
2324
min-height:100vh;
2425
display:flex;
@@ -32,7 +33,7 @@ <h1 class="speed">
3233
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
3334
background-color:#282828;
3435
background-size:16px 16px;
35-
background-position: fixed;
36+
background-attachment: fixed;
3637
}
3738

3839
.arrow {

0 commit comments

Comments
 (0)