-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathparable-of-the-sower.html
152 lines (143 loc) · 5.07 KB
/
parable-of-the-sower.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Parable of the Sower</title>
<link rel="stylesheet" href="./public/styles/styles.css" />
<!-- Google Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Fredericka+the+Great&family=Open+Sans&display=swap"
rel="stylesheet"
/>
<!-- Font Awesome -->
<script
src="https://kit.fontawesome.com/27b39b2da2.js"
crossorigin="anonymous"
></script>
</head>
<body>
<!-- Navigation Bar -->
<header class="header">
<nav class="navbar">
<div class="navbar-container">
<div class="logo">
<a href="./index.html">
<img
class
src="./public/images/CodeSquad-Comics-logo.png"
alt="CodeSquad-Comics-logo"
/>
</a>
</div>
<div class="nav-links">
<ul class>
<li><a href="./index.html">HOME</a></li>
<li><a href="./about.html">ABOUT</a></li>
<li><a href="./login.html">LOGIN</a></li>
</ul>
</div>
<a class="hamburger" href="#" class="icon">
<i class="fa fa-bars"></i>
</a>
</div>
</nav>
</header>
<!-- Main Section -->
<main class="main-container bg-gradient">
<section class="card">
<div class="card-top">
<h1 class="card-title">PARABLE OF THE SOWER</h1>
<img
class="card-img"
src="./public/images/parable-of-the-sower.jpg"
alt="parable-of-the-sower-pic"
/>
</div>
<div class="card-bottom">
<div class="card-details">
<p>
<span class="card-info-style">Title: </span
><span class="card-answer-style">Parable of the Sower</span>
</p>
<p>
<span class="card-info-style">Author:</span> Octavia E. Butler
</p>
<p>
<span class="card-info-style">Publisher:</span> Harry N. Abrams
</p>
<p><span class="card-info-style">Genre:</span> dystopian</p>
<p><span class="card-info-style">Number of pages:</span> 284</p>
<p><span class="card-info-style">Rating:</span> 4</p>
<p>
<span class="card-info-style">Synopsis:</span> In this graphic
novel adaptation of Octavia E. Butler’s Parable of the Sower by
Damian Duffy and John Jennings, the award-winning team behind
Kindred: A Graphic Novel Adaptation, the author portrays a searing
vision of America’s future. In the year 2024, the country is
marred by unattended environmental and economic crises that lead
to social chaos. Lauren Olamina, a preacher’s daughter living in
Los Angeles, is protected from danger by the walls of her gated
community. However, in a night of fire and death, what begins as a
fight for survival soon leads to something much more: a startling
vision of human destiny . . . and the birth of a new faith.
</p>
</div>
</div>
</section>
</main>
<!-- Footer Section -->
<footer class="footer">
<section class="footer-container">
<div class="footer-column">
<h3 class="footer-h3">VISIT US</h3>
<ul class="footer-links">
<li>CodeSquad Comics</li>
<li>123 Dorchester Avenue</li>
<li>Boston, MA 02124</li>
</ul>
</div>
<div class="footer-column">
<h3 class="footer-h3">LINKS</h3>
<ul class="footer-links">
<li><a href="./index.html">Home</a></li>
<li><a href="./about.html">About</a></li>
<li><a href="./login.html">Login</a></li>
</ul>
</div>
<div class="footer-column">
<h3 class="footer-h3">FOLLOW US</h3>
<ul class="footer-links">
<div class="social">
<li>
<a href="#"><i class="fa-brands fa-facebook"></i></a>
</li>
<li>
<a href="#"><i class="fa-brands fa-instagram"></i></a>
</li>
<li>
<a href="#"><i class="fa-brands fa-twitter"></i></a>
</li>
</div>
</ul>
</div>
<div class="footer-column">
<h3 class="footer-h3">A PRODUCT OF</h3>
<a
href="http://codesquad.org/"
target="_blank"
rel="noopener noreferrer"
>
<img
class="footer-img-size"
src="./public/images/CodeSquad-logo-b.png"
alt="CodeSquad-Footer-logo"
/>
</a>
</div>
</section>
</footer>
</body>
</html>