Skip to content

Commit 406ad2b

Browse files
committed
fixup for html file
1 parent b7900d0 commit 406ad2b

File tree

10 files changed

+380
-13
lines changed

10 files changed

+380
-13
lines changed

lib/box/blocks.css

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
.block {
2+
width: 130px;
3+
margin: 0 auto;
4+
display: block;
5+
}

lib/box/main.css

Lines changed: 109 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,109 @@
1-
html{
2-
background-color:red;
3-
}
1+
2+
body {
3+
background: #FDD761;
4+
font-family: 'Lucida Sans Unicode', 'Arial', serif;
5+
color: white;
6+
}
7+
8+
header .btn {
9+
text-transform: uppercase;
10+
}
11+
12+
header a:hover, .about a:hover {
13+
background: #fcc316;
14+
}
15+
16+
header .btn, .services {
17+
margin-top: 100px;
18+
}
19+
20+
header {
21+
padding: 80px 0 150px;
22+
}
23+
24+
header {
25+
background: url("https://unsplash.it/1080/720/?image=377") no-repeat fixed center / cover;
26+
text-align: center;
27+
}
28+
29+
30+
/* GENERAL STYLES
31+
–––––––––––––––––––––––––––––––––––––––––––––––––– */
32+
33+
34+
35+
36+
37+
38+
39+
40+
41+
42+
/* HEADER STYLES
43+
–––––––––––––––––––––––––––––––––––––––––––––––––– */
44+
45+
46+
47+
48+
49+
50+
51+
52+
/* SERVICES STYLES
53+
–––––––––––––––––––––––––––––––––––––––––––––––––– */
54+
55+
56+
57+
58+
59+
60+
/* ABOUT STYLES
61+
–––––––––––––––––––––––––––––––––––––––––––––––––– */
62+
63+
.about {
64+
background: url("https://unsplash.it/1080/720/?image=349") no-repeat fixed center / cover;
65+
color: black;
66+
}
67+
68+
.about .one-third,
69+
.about .two-thirds {
70+
background: white;
71+
background: rgba(255,255,255,.3);
72+
padding: 10px;
73+
border-radius: 5px;
74+
}
75+
76+
.about .one-third {
77+
margin-top: 20px;
78+
}
79+
80+
.about a {
81+
margin-top: 10px;
82+
}
83+
84+
.about ul {
85+
margin-bottom:18px;
86+
}
87+
88+
.about h3:after, .contact h3:after {
89+
border-color: black;
90+
}
91+
92+
.about .center {
93+
text-align: center;
94+
}
95+
96+
.about .bottom {
97+
margin-bottom: 20px;
98+
padding-bottom: 20px;
99+
}
100+
101+
.about .one-third a {
102+
margin: 10px auto;
103+
width: 50%;
104+
display: block;
105+
}
106+
107+
.about .two-thirds p:last-child {
108+
margin-bottom: 0;
109+
}

lib/box/positioning.css

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
2+
.about, .contact {
3+
padding: 150px 0;
4+
}
5+
6+
.services p {
7+
margin: 15px 0 0;
8+
}
9+
10+
.about .one-third {
11+
margin-top: 20px;
12+
}
13+
14+
.about a {
15+
margin-top: 10px;
16+
}
17+
18+
.about ul {
19+
margin-bottom:18px;
20+
}
21+
22+
.about .bottom {
23+
margin-bottom: 20px;
24+
padding-bottom: 20px;
25+
}
26+
27+
.about .one-third a {
28+
margin: 10px auto;
29+
width: 50%;
30+
display: block;
31+
}
32+
33+
.about .two-thirds p:last-child {
34+
margin-bottom: 0;
35+
}
36+
37+
@media (min-width: 550px) {
38+
.about .one-third {
39+
margin-top: 0;
40+
}
41+
}

lib/elements/button.css

Lines changed: 94 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,94 @@
1+
a {
2+
text-align: center;
3+
outline: none;
4+
display: inline-block;
5+
text-decoration: none;
6+
background: #fcca2f;
7+
font-size: 14px;
8+
color: steelblue;
9+
text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.25);
10+
-webkit-transition: all ease .3s;
11+
transition: all ease .3s;
12+
}
13+
14+
nav a {
15+
position: relative;
16+
width: 100%;
17+
height: 30px;
18+
padding: 7px 0;
19+
line-height: 30px;
20+
}
21+
22+
.btn {
23+
font-size: 1.2em;
24+
border-radius: 5px;
25+
padding: 12px 30px;
26+
}
27+
28+
.services a {
29+
padding: 25px;
30+
background: #fafafa;
31+
margin-top: 20px;
32+
border-radius: 4px;
33+
}
34+
35+
36+
.services a:hover {
37+
color: black;
38+
}
39+
40+
.services a:hover span {
41+
color: white;
42+
}
43+
44+
45+
46+
@media (min-width: 550px) {
47+
48+
a {
49+
box-shadow: 0 8px #f4ba04;
50+
}
51+
52+
nav a {
53+
padding: 7px;
54+
border-right: 1px solid #fabd03;
55+
width: 80px;
56+
}
57+
58+
59+
60+
header a:hover, .about a:hover {
61+
box-shadow: 0 8px #f4ba04;
62+
}
63+
64+
header a:active, .about a:active {
65+
box-shadow: 0 4px #f4ba04;
66+
-webkit-transform: translateY(4px);
67+
-ms-transform: translateY(4px);
68+
transform: translateY(4px);
69+
}
70+
71+
.about .one-third a {
72+
width: 35%;
73+
}
74+
75+
.contact .creator a {
76+
box-shadow: none;
77+
}
78+
79+
}
80+
81+
@media (min-width: 750px) {
82+
.services a:hover {
83+
box-shadow: 0 -8px white;
84+
-webkit-transform: scale(1.15);
85+
-ms-transform: scale(1.15);
86+
transform: scale(1.15);
87+
}
88+
89+
.contact ul a {
90+
margin-left: 45px;
91+
}
92+
93+
94+
}

lib/elements/colors.css

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
.about .one-third,
2+
.about .two-thirds {
3+
background: white;
4+
background: rgba(255,255,255,.3);
5+
}

lib/elements/fonts.css

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
h1, h3, h4, header .btn {
2+
font-weight: 700;
3+
}
4+
5+
h1 {
6+
margin: 100px 0 20px;
7+
text-transform: uppercase;
8+
font-size: 2.6rem;
9+
}
10+
11+
h3 {
12+
margin-bottom: 25px;
13+
font-size: 2.3rem;
14+
text-align: left;
15+
}
16+
17+
h4 {
18+
font-size: 2rem;
19+
}
20+
21+
h3:after {
22+
content: '';
23+
display: block;
24+
width: 10%;
25+
padding-top: 5px;
26+
border-bottom: 3px solid whitesmoke;
27+
}
28+
29+
h1 + h4 {
30+
font-weight: normal;
31+
}
32+
33+
.services span {
34+
font-size: 5.5em;
35+
color: #f4ba04;
36+
}
37+
38+
.about .center {
39+
text-align: center;
40+
}
41+
42+
.about h3:after, .contact h3:after {
43+
border-color: black;
44+
}
45+
46+
.contact {
47+
color: black;
48+
text-align: center;
49+
}
50+
51+
@media (min-width: 750px) {
52+
53+
h1 {
54+
font-size: 3.5rem;
55+
}
56+
57+
h3 {
58+
font-size: 2.8rem;
59+
}
60+
61+
h4 {
62+
font-size: 2.4rem;
63+
}
64+
65+
.contact ul span {
66+
font-size: 3em;
67+
}
68+
69+
}

lib/elements/images.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
.about {
2+
background: url("https://unsplash.it/1080/720/?image=349") no-repeat fixed center / cover;
3+
color: black;
4+
}

lib/elements/lists.css

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
nav ul, .contact ul {
2+
list-style: none;
3+
font-size: 0;
4+
}
5+
6+
nav li, .contact li {
7+
margin-bottom: 0;
8+
display: inline-block;
9+
}
10+
11+
nav li {
12+
width: 50%;
13+
}
14+
15+
16+
17+
nav li:nth-child(2n+1) a:after {
18+
position: absolute;
19+
content: '';
20+
top: 19.5px;
21+
right: -2.5px;
22+
z-index: 10;
23+
border-radius: 100%;
24+
background: steelblue;
25+
width: 5px;
26+
height: 5px;
27+
}
28+
29+
@media (min-width: 550px) {
30+
31+
nav li {
32+
width: auto;
33+
}
34+
35+
nav li:nth-child(2n+1) a:after {
36+
content: none;
37+
}
38+
39+
nav li:last-child a {
40+
border-right: none;
41+
}
42+
43+
}

skeleton.spec

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"name": "skeleton",
3+
"authors": "Dave Gamache",
4+
"email": "http://www.davegamache.com",
5+
"description": "Skeleton: A Dead Simple, Responsive Boilerplate for Mobile-Friendly Development",
6+
"version": "2.0.4",
7+
"homepage": "https://github.com/fdp-A4/skeleton",
8+
"dependencies": {
9+
}
10+
}

0 commit comments

Comments
 (0)