Skip to content

Commit d1fe49a

Browse files
matowdevmatowdev
committed
[proj. Lounge] Change lounge.html file, @media
Replacing lounge.html, style.css files. Styling, adding media queries. LP from Books
1 parent 49a51ae commit d1fe49a

21 files changed

Lines changed: 380 additions & 37 deletions

‎.vscode/settings.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22
"cSpell.ignoreWords": [
33
"BYOWS",
44
"Baena",
5+
"Bukem",
6+
"Challe",
57
"Concequence",
68
"Simino",
79
"Starbuzz",

‎Learning_HTML_CSS_Freeman_E/Lounge/css/mediaquery.css‎

Lines changed: 168 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,168 @@
1+
@media screen and (min-width: 481px) {
2+
body {
3+
font-size: small;
4+
font-family: Verdana, Helvetica, Arial, sans-serif;
5+
line-height: 1.6em;
6+
}
7+
8+
h1,
9+
h2 {
10+
color: #007e7e;
11+
}
12+
13+
h1 {
14+
font-size: 150%;
15+
}
16+
17+
h2 {
18+
font-size: 130%;
19+
}
20+
21+
#guarantee {
22+
line-height: 1.9em;
23+
font-style: italic;
24+
font-family: Georgia, "Times New Roman", Times, serif;
25+
color: #444444;
26+
border-color: white;
27+
border-width: 1px;
28+
border-style: dashed;
29+
background-color: #a7cece;
30+
padding: 25px;
31+
padding-left: 80px;
32+
margin: 30px;
33+
margin-right: 250px;
34+
background-image: url(images/background.gif);
35+
background-repeat: no-repeat;
36+
background-position: top left;
37+
}
38+
}
39+
40+
@media screen and (max-width: 480px) {
41+
body {
42+
font-size: small;
43+
font-family: Verdana, Helvetica, Arial, sans-serif;
44+
line-height: 1.6em;
45+
}
46+
47+
h1,
48+
h2 {
49+
color: #007e7e;
50+
}
51+
52+
h1 {
53+
font-size: 150%;
54+
}
55+
56+
h2 {
57+
font-size: 130%;
58+
}
59+
60+
#guarantee {
61+
line-height: 1.9em;
62+
font-style: italic;
63+
font-family: Georgia, "Times New Roman", Times, serif;
64+
color: #444444;
65+
border-color: white;
66+
border-width: 1px;
67+
border-style: dashed;
68+
background-color: #a7cece;
69+
padding: 25px;
70+
margin: 30px;
71+
}
72+
}
73+
74+
@media print {
75+
body {
76+
font-size: 12pt;
77+
font-family: Times, "Times New Roman", serif;
78+
line-height: 1.4em;
79+
margin: 10px 40px 10px 40px;
80+
width: 700px;
81+
}
82+
83+
h1,
84+
h2 {
85+
color: black;
86+
}
87+
88+
h1 {
89+
font-size: 150%;
90+
}
91+
92+
h2 {
93+
font-size: 130%;
94+
}
95+
96+
#guarantee {
97+
padding: 25px 25px 25px 25px;
98+
border: thin solid black;
99+
margin-right: 240px;
100+
margin-left: 30px;
101+
line-height: 1.5em;
102+
font-style: italic;
103+
font-family: Georgia, "Times New Roman", Times, serif;
104+
color: #222222;
105+
}
106+
107+
#elixirs {
108+
font-family: Verdana, Helvetica, Arial, sans-serif;
109+
width: 200px;
110+
background-color: #ffffff;
111+
background: url("images/elixirbackground.gif") repeat-x top center;
112+
padding: 0px 20px 20px 20px;
113+
margin-left: 25px;
114+
color: #000000;
115+
border: thin double #007e7e;
116+
text-align: center;
117+
font-size: 80%;
118+
}
119+
120+
#elixirs a:link {
121+
color: #007e7e;
122+
}
123+
#elixirs a:visited {
124+
color: #333333;
125+
}
126+
#elixirs a:hover {
127+
background: #f88396;
128+
color: #0d5353;
129+
}
130+
131+
#elixirs h2 {
132+
color: #000000;
133+
}
134+
135+
#elixirs h3 {
136+
color: #d12c47;
137+
}
138+
139+
#elixirs img {
140+
padding-top: 20px;
141+
}
142+
143+
#elixirs p {
144+
line-height: 1em;
145+
}
146+
147+
#footer {
148+
font-size: 50%;
149+
text-align: center;
150+
line-height: normal;
151+
margin-top: 30px;
152+
}
153+
154+
.artist {
155+
font-weight: bold;
156+
}
157+
158+
.cd {
159+
font-style: italic;
160+
}
161+
162+
body p a:link {
163+
color: #007e7e;
164+
}
165+
body p a:visited {
166+
color: #333333;
167+
}
168+
}

‎Learning_HTML_CSS_Freeman_E/Lounge/css/mobile.css‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
body {
2+
font-family: Verdana, Helvetica, Arial, sans-serif;
3+
font-size: small;
4+
line-height: 1.6em;
5+
}
6+
7+
h1,
8+
h2 {
9+
color: #007e7e;
10+
}
11+
12+
h1 {
13+
font-size: 150%;
14+
}
15+
16+
h2 {
17+
font-size: 130%;
18+
}
19+
20+
#guarantee {
21+
margin: 30px;
22+
border: 1px dashed white;
23+
padding: 25px;
24+
font-family: Georgia, "Times New Roman", Times, serif;
25+
line-height: 1.9em;
26+
font-style: italic;
27+
color: #444;
28+
background-color: #a7cece;
29+
}

‎Learning_HTML_CSS_Freeman_E/Lounge/css/print.css‎

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
body {
2+
font-size: 12pt;
3+
font-family: Times, "Times New Roman", serif;
4+
line-height: 1.4em;
5+
margin: 10px 40px 10px 40px;
6+
width: 700px;
7+
}
8+
9+
h1,
10+
h2 {
11+
color: black;
12+
}
13+
14+
h1 {
15+
font-size: 150%;
16+
}
17+
18+
h2 {
19+
font-size: 130%;
20+
}
21+
22+
#guarantee {
23+
padding: 25px 25px 25px 25px;
24+
border: thin solid black;
25+
margin-right: 240px;
26+
margin-left: 30px;
27+
line-height: 1.5em;
28+
font-style: italic;
29+
font-family: Georgia, "Times New Roman", Times, serif;
30+
color: #222222;
31+
}
32+
33+
#elixirs {
34+
font-family: Verdana, Helvetica, Arial, sans-serif;
35+
width: 200px;
36+
background-color: #ffffff;
37+
background: url("images/elixirbackground.gif") repeat-x top center;
38+
padding: 0px 20px 20px 20px;
39+
margin-left: 25px;
40+
color: #000000;
41+
border: thin double #007e7e;
42+
text-align: center;
43+
font-size: 80%;
44+
}
45+
46+
#elixirs a:link {
47+
color: #007e7e;
48+
}
49+
#elixirs a:visited {
50+
color: #333333;
51+
}
52+
#elixirs a:hover {
53+
background: #f88396;
54+
color: #0d5353;
55+
}
56+
57+
#elixirs h2 {
58+
color: #000000;
59+
}
60+
61+
#elixirs h3 {
62+
color: #d12c47;
63+
}
64+
65+
#elixirs img {
66+
padding-top: 20px;
67+
}
68+
69+
#elixirs p {
70+
line-height: 1em;
71+
}
72+
73+
#footer {
74+
font-size: 50%;
75+
text-align: center;
76+
line-height: normal;
77+
margin-top: 30px;
78+
}
79+
80+
.artist {
81+
font-weight: bold;
82+
}
83+
84+
.cd {
85+
font-style: italic;
86+
}
87+
88+
body p a:link {
89+
color: #007e7e;
90+
}
91+
body p a:visited {
92+
color: #333333;
93+
}

‎Learning_HTML_CSS_Freeman_E/Lounge/css/style.css‎

Lines changed: 24 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,33 @@
11
body {
2-
font-family: sans-serif;
3-
}
4-
5-
h1 {
6-
border-bottom: 1px solid gray;
7-
color: gray;
2+
font-family: Verdana, Helvetica, Arial, sans-serif;
3+
font-size: small;
4+
line-height: 1.6em;
85
}
96

7+
h1,
108
h2 {
11-
color: gray;
12-
}
13-
14-
p {
15-
color: maroon;
16-
}
17-
18-
em {
19-
font-family: serif;
9+
color: #007e7e;
2010
}
2111

22-
.green-tea {
23-
color: lightgreen;
24-
}
25-
26-
.raspberry-ice {
27-
color: lightskyblue;
28-
}
29-
30-
.blueberry-bliss {
31-
color: violet;
12+
h1 {
13+
font-size: 150%;
3214
}
3315

34-
.cranberry-antioxidant {
35-
color: lightcoral;
16+
h2 {
17+
font-size: 130%;
18+
}
19+
20+
#guarantee {
21+
margin: 30px;
22+
margin-right: 250px;
23+
border: 2px dashed white;
24+
padding: 25px;
25+
padding-left: 80px;
26+
font-family: Georgia, Times, serif;
27+
line-height: 1.9em;
28+
color: #444;
29+
background-color: #a7cece;
30+
background-image: url("../images/background.gif");
31+
background-repeat: no-repeat;
32+
background-position: top left;
3633
}

‎Learning_HTML_CSS_Freeman_E/Lounge/images/background.gif‎

706 Bytes
Loading

‎Learning_HTML_CSS_Freeman_E/Lounge/images/black.gif‎

4.19 KB
Loading

‎Learning_HTML_CSS_Freeman_E/Lounge/images/blue.gif‎

5.34 KB
Loading

Learning_HTML_CSS_Freeman_E/Lounge/img/blue.jpg renamed to Learning_HTML_CSS_Freeman_E/Lounge/images/blue.jpg

File renamed without changes.

‎Learning_HTML_CSS_Freeman_E/Lounge/images/chai.gif‎

4.19 KB
Loading

0 commit comments

Comments
 (0)