Skip to content

Commit e9624f1

Browse files
committed
Add base code for exercise 4 in lesson 3
1 parent 17951d5 commit e9624f1

32 files changed

Lines changed: 868 additions & 0 deletions

Lesson03/exercise_004/css/semantic.min.css

Lines changed: 372 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
body {
2+
background-attachment: fixed;
3+
background-image: url('../images/brick-wall-1245825_1920.jpg');
4+
}
5+
6+
body > section {
7+
background: rgba(200, 200, 200, 0.4);
8+
height: 100%;
9+
margin: 0 auto;
10+
overflow-y: scroll;
11+
padding: 10px 20px;
12+
width: 1024px;
13+
}
14+
15+
h1.title {
16+
color: #6b2a13;
17+
font-size: 3em;
18+
}
19+
20+
.ui.items .item {
21+
background: rgba(250, 250, 250, 0.8);
22+
border-radius: 5px;
23+
box-shadow: #444 2px 2px 5px;
24+
padding: 10px;
25+
}
26+
27+
.ui.items .item img {
28+
max-height: 150px;
29+
}
Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
body {
2+
background-attachment: fixed;
3+
background-image: url('../images/brick-wall-1245825_1920.jpg');
4+
overflow: hidden;
5+
}
6+
7+
body > #content {
8+
background: rgba(200, 200, 200, 0.4);
9+
margin: 0 auto;
10+
padding: 10px 20px;
11+
width: 1024px;
12+
}
13+
14+
section.header {
15+
height: 115px;
16+
}
17+
18+
h1.title {
19+
color: #6b2a13;
20+
font-size: 3em;
21+
}
22+
23+
.ui.items {
24+
height: calc(100% - 160px);
25+
overflow-y: auto;
26+
padding: 10px;
27+
}
28+
29+
.ui.items .item {
30+
background: rgba(250, 250, 250, 0.8);
31+
border-radius: 5px;
32+
box-shadow: #444 2px 2px 5px;
33+
margin-bottom: 10px;
34+
padding: 10px;
35+
}
36+
37+
.ui.items .item img {
38+
max-height: 150px;
39+
}
40+
41+
.ui.label {
42+
cursor: pointer;
43+
}
44+
45+
.ui.menu {
46+
font-size: 1rem;
47+
background: rgba(255, 255, 255, 0.4);
48+
box-shadow: #666 2px 2px 10px;
49+
}
50+
51+
.ui.menu .item .tags {
52+
margin-left: 5px;
53+
}
49.3 KB
Binary file not shown.
Binary file not shown.
Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<html>
2+
<head>
3+
<link rel="stylesheet" type="text/css" href="css/semantic.min.css" />
4+
<link rel="stylesheet" type="text/css" href="css/store_with_header.css" />
5+
</head>
6+
<body>
7+
<section>
8+
<h1 class="title">Welcome to Fresh Products Store!</h1>
9+
<div class="ui items">
10+
{{#products}}
11+
<div class="item">
12+
<div class="image"><img src="{{image}}" /></div>
13+
<div class="content">
14+
<a class="header">{{name}}</a>
15+
<div class="meta">
16+
<span>${{price}} / {{unit}}</span>
17+
</div>
18+
<div class="description">{{description}}</div>
19+
<div class="extra">
20+
{{#tags}}
21+
<div class="ui label teal">{{this}}</div>
22+
{{/tags}}
23+
</div>
24+
</div>
25+
</div>
26+
{{/products}}
27+
</div>
28+
</section>
29+
</body>
30+
</html>
1.46 MB
Loading
64 KB
Loading
90.7 KB
Loading
99 KB
Loading

0 commit comments

Comments
 (0)