Skip to content

Commit 6e8abd7

Browse files
imoshepimoshep
committed
finished
1 parent e261b09 commit 6e8abd7

File tree

6 files changed

+223
-192
lines changed

6 files changed

+223
-192
lines changed

‎RGB.css

-35
This file was deleted.

‎RGB.html

-29
This file was deleted.

‎RGB.js

-128
This file was deleted.

‎colorGame.css

+75
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
body {
2+
background-color: #232323;
3+
margin: 0;
4+
font-family: "Montserrat", "Avenir";
5+
}
6+
7+
.square {
8+
width: 30%;
9+
background: purple;
10+
padding-bottom: 30%;
11+
float: left;
12+
margin: 1.66%;
13+
border-radius: 15%;
14+
transition: background 0.6s;
15+
-webkit-transition: background 0.6s;
16+
-moz-transition: background 0.6s;
17+
}
18+
19+
#container {
20+
margin: 20px auto;
21+
max-width: 600px;
22+
}
23+
24+
h1 {
25+
text-align: center;
26+
line-height: 1.1;
27+
font-weight: normal;
28+
color: white;
29+
background: steelblue;
30+
margin: 0;
31+
text-transform: uppercase;
32+
padding: 20px 0;
33+
}
34+
35+
#colorDisplay {
36+
font-size: 200%;
37+
}
38+
39+
#message {
40+
display: inline-block;
41+
width: 20%;
42+
}
43+
44+
#stripe {
45+
background: white;
46+
height: 30px;
47+
text-align: center;
48+
color: black;
49+
}
50+
51+
.selected {
52+
color: white;
53+
background: steelblue;
54+
}
55+
56+
button {
57+
border: none;
58+
background: none;
59+
text-transform: uppercase;
60+
height: 100%;
61+
font-family: inherit;
62+
font-weight: 700;
63+
color: steelblue;
64+
letter-spacing: 1px;
65+
font-size: inherit;
66+
transition: all 0.3s;
67+
-webkit-transition: all 0.3s;
68+
-moz-transition: all 0.3s;
69+
outline: none;
70+
}
71+
72+
button:hover {
73+
color: white;
74+
background: steelblue;
75+
}

‎colorGame.html

+35
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Color Game</title>
5+
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat">
6+
<link rel="stylesheet" type="text/css" href="colorGame.css">
7+
</head>
8+
<body>
9+
<h1>
10+
The Great
11+
<br>
12+
<span id="colorDisplay">RGB</span>
13+
<br>
14+
Color Game
15+
</h1>
16+
17+
<div id="stripe">
18+
<button id="reset">New Colors</button>
19+
<span id="message"></span>
20+
<button class="mode">Easy</button>
21+
<button class="mode selected">Hard</button>
22+
</div>
23+
24+
<div id="container">
25+
<div class="square"></div>
26+
<div class="square"></div>
27+
<div class="square"></div>
28+
<div class="square"></div>
29+
<div class="square"></div>
30+
<div class="square"></div>
31+
</div>
32+
33+
<script type="text/javascript" src="colorGame.js"></script>
34+
</body>
35+
</html>

0 commit comments

Comments
 (0)