-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
285 lines (274 loc) · 19 KB
/
index.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
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
<!DOCTYPE html>
<!-- READ ME:
The following is the assignmet that was the basis for this web site:
Direction:
Before you start working on this learning activity, you should choose a topic. About what or who or whom do you want to build a website? What kind of information will you display on the website? What type of design pattern will you follow?
Once you have determined and answered the above questions to yourself, you can proceed to code.
Create a four-page website that includes pages such as: home, about, profession, area of interest, resource, others, services, products, gallery, contact us.
Each page should have header, body and footer section.
The style you use for the footer must be the same on all pages.
Each page must have:
One to three lengthy paragraphs of text
A heading for each paragraph
Different color, font-size, font-style, font-family for 3 keywords in your paragraph
All types of lists: ordered, unordered, definition list
Multiple pictures (saved locally) and positioned differently
At least in one of your pages there should include a table
Use a single CSS file to style all of your pages:
<link>
Background
Headings size and font-family
Paragraphs size and font-family
Lists: font-family, color and font style
Links: colors and text-decoration
Use an Internal Style Sheet <style> to give each sheet unique format.
Create a navigation bar to create a link. All pages must link to all other pages. According to Q3, your navigation bar link should have uniform style on every page.
The web application should be responsive.
Optional, you can think to add some sliding image or animation to some of your images on any of your pages.
-->
<html lang="en" style="scroll-behavior: smooth">
<head>
<title>Home</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style/mystyles.css">
</head>
<body>
<!-- ================================ Header ================================ -->
<header>
<div id="headerLine">
<h1>The World of Scott Sigler</h1>
</div>
<nav class="navText orangeLink">
<ul>
<li class="navOnPage">⇦</li>
<li class="navSpacer">|</li>
<li class="navOnPage italics">Home </li>
<li class="navSpacer">|</li>
<li><a href="page2.html">Modern Era</a></li>
<li class="navSpacer">|</li>
<li><a href="page3.html">GFL Era</a></li>
<li class="navSpacer">|</li>
<li><a href="page4.html">Other IP</a></li>
<li class="navSpacer">|</li>
<li><a href="page2.html">⇨</a></li>
</ul>
</nav>
</header>
<!-- ================================ Sidebar ================================ -->
<div class="wrapper">
<div class="sidebar orangeLink">
<div class="fixedSidebar ">
<div id="onPageNav">
<details>
<summary>On this page</summary>
<a href="#top">Dawn of Podcasting</a><br>
<a href="#siggy">Scott Sigler</a><br>
<a href="#longest">World's longest running fiction podcast</a><br>
<a href="#theJunkies">The Junkies</a><br>
<a href="#theSiglerverse">The Siglerverse</a><br>
<a href="#otherMedia">Other media</a>
</details>
<br>
</div>
<hr class="xsmallHide">
<div class="social">
<h4>Sigler Social:</h4>
<ul class="left">
<li>
<a href="https://www.scottsigler.com">
<img alt="SiglerIcon " style="width:1em; border:1px solid orangered;" src="images/icons/ELMNT-scottsigler.png">
scottsigler.com
</a>
</li>
<li>
<a href="https://www.facebook.com/scottsigler">
<img alt="Facebook " style="width:1em;" src="images/icons/icons_facebook_13_550.webp">
Facebook
</a>
</li>
<li>
<a href="http://www.twitter.com/scottsigler">
<img alt="Twitter " style="width:1em;" src="images/icons/icons_twitter_07_550.webp">
Twitter
</a>
</li>
<li>
<a href="http://instagram.com/scottsigler">
<img alt="Instagram " style="width:1em;" src="images/icons/icons_instagram_07_78.webp">
Instagram
</a>
</li>
<li>
<a href="http://www.youtube.com/user/scottsigler">
<img alt="YouTube " style="width:1em;" src="images/icons/icons_youtube_04_550.webp">
YouTube
</a>
</li>
<li>
<a href="https://www.linkedin.com/in/scottsigler/">
<img alt="LinkedIn " style="width:1em;" src="images/icons/icons_linkedin_04_550.webp">
LinkedIn
</a>
</li>
<li>
<a href="http://siglerpedia.scottsigler.com/wiki/index.php/Main_Page">
<img alt="SiglerIcon" style="width:1em; border:1px solid orangered;" src="images/icons/ELMNT-scottsigler.png">
The Siglerpedia
</a>
</li>
</ul>
<hr class="xsmallHide">
<div class="xsmall">
<hr>
<br>
<h4><a href="#top">Top of Page</a></h4>
</div>
</div>
<div class="junkieFix">
<h4>Get your fix:</h4>
<div>
<a href="https://www.chapters.indigo.ca/en-ca/home/search/?keywords=scott%20sigler#internal=1">
<img alt="Indigo" class="fix fixpic" style="background-color:lightgrey" src="images/icons/320px-Indigo_Logo.svg.png">
</a>
</div>
<div>
<a href="https://www.audible.ca/search?keywords=scott+sigler&ref=a_ep_editor_t1_header_search">
<img alt="Audible" class="fix fixpic" style="background-color:lightgrey" src="images/icons/NicePng_audible-logo-png_small.png">
</a>
<br>
</div>
<div>
<a href="https://www.amazon.ca/s?k=scott+sigler&ref=nb_sb_noss_2"><img class="fix fixpic" alt="Amazon" src="images/icons/NicePng_amazon-logo-png_small.png"></a><br>
</div>
<div><a href="https://podcasts.apple.com/us/podcast/scott-siglers-audiobooks/id78561049"><img class="fix fixpic" alt="Podcast" src="images/icons/NicePng_please-subscribe-png_small.png"></a>
</div>
<!--webp icons courtesy: https://www.picmonkey.com/graphics/social-media-icons
png icons sourced from https://www.nicepng.com/-->
</div>
</div>
</div>
<!-- ================================ Main Content ================================ -->
<div class="dawn text">
<div id="top" class="idScroll"></div>
<div class="backgroundImageContainer">
<div id="sunshineBG"></div>
<div>
<h2 >The Dawn of Podcasting</h2>
<p>
In the beginning there were 3.
</p>
<p>
In March of 2005, 3 writers had independently come to the same idea: "why not 'publish' my novel as a podcast?" and within weeks of each other, their first episodes were released.
</p>
</div>
</div>
<div>
<p>
The 3 fathers of the podcast novel (podiobook) are:
</p>
<dl>
<dt class="bold">Tee Morris</dt>
<dd><a href="https://podcasts.apple.com/us/podcast/morevi-the-chronicles-of-rafe-and-askana-remastered/id563111787">Morevi</a>
</dd>
<dt class="bold">Mark Jeffery</dt>
<dd><a href="https://podcasts.apple.com/us/podcast/max-quick-1-the-pocket-and-the-pendant/id562794977">The Pocket and the Pendant</a></dd>
<dt class="bold">Scott Sigler</dt>
<dd><a href="https://scottsigler.com/podcast/earthcore-episode-1/">Earthcore</a></dd>
</dl>
<p>This is the story of Scott Sigler, and the world's longest running fiction podcast!</p>
<div class="imageLRP centerPic">
<img src="images/longestPodcast.jpg" alt="Worlds Longest Running Fiction Podcast">
</div>
</div>
</div>
<div class="siggyFans text" >
<h2 id="siggy" class="idScroll">About Scott Sigler</h2>
<div class="siggyPicDiv">
<img class="siggyPic" alt="Scott Sigler" src="images/small/2015-Scott-Author-Photo-small.jpg">
<div class="siggyCaption">
<p>The Future Dark ∅verlord <br>Scott Sigler</p>
</div>
</div>
<div>
<p>
Scott is a #1 New York Times best selling author. He has published his books through Crown Publishing, Del-Rey, and self-published a series of limited edition, numbered, and signed books through his company, <a href="https://emptyset.com/">Empty Set Entertainment</a>.
</p>
<p>
Born in Michigan, Scott grew up with a love of sports. Playing football in high school and wrestling throughout college. He has the misfortune of being a lifelong Detroit Lions fan. He now lurks in San Diego, California with his wife and business partner, A (yes that is her real name). </p>
<p>Scott plays bass and sings for the band <a href="https://www.superweaponband.com/">Superweapon.</a> While he is an inaugural member of the <a href="https://academyofpodcasters.pairsite.com/">Podcasting Hall of Fame</a>, his first short story "Tentacles, Tentacles, and more Tentacles" (written circa age 8) remains unpublished by a major publishing house.
</p>
</div>
</div>
<div class="content text">
<div><h2 class="idScroll" id="longest" style="text-align:center;">The World's Longest Running Fiction Podcast!</h2></div>
<div class="LRP">
<iframe src="https://open.spotify.com/embed/show/0iEwE8YHtoAwdWAYm9KJog?utm_source=generator" width="100%" height="232" frameborder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture"></iframe></div>
<div class="LRP lrpText">
<p>Scott Sigler's podcasts have been dropping every Sunday, with a few exceptions, ever since 2005. Scott's dedication to his fans is second to none, to the point where many fans have found themselves named in his books!</p>
<p>Scott has always been accessible to fans through social media, and ancillary podcasts, but during the COVID pandemic, he and A have been live-streaming every Wednesday on multiple platforms, chatting with fans and talking with multiple guests in their "Sigler in Place" series. </p>
</div>
<h2 class="under1200 ">The Junkies</h2><div class="idScroll" id="theJunkies"></div>
<div class="backgroundImageContainer junkies" >
<div class="centerPic">
<img src="images/SiglerFest2k17-team-photo-500.jpg" class="backgroundImage">
</div>
<h3 class="over1200">The Junkies</h3>
<p>
Sigler's fans kept responding to his stories, begging for more, and soon became known as "Junkies." A term that remains to this day. In the podcast, he has assumed an "over-the-top morning DJ" persona that is quite entertaining. Dubbing himself, the "Future Dark ∅verlord" (or FD∅), general Siglerisimo has plans for plaid tanks to roll once he rules the world!
</p>
<p>
Dedicated to his fans, Scott started SiglerFest. For the last 9 years BC (before COVID), during the October long weekend, Junkies from around the world gathered for a celebration of Siglerdom. They would hang out with the FD∅, meet some of his "cousins," including Pope Siglericus XXX and Francis Dominic Oliveri, bowl, sing karaoke, watch the Detroit Lions lose, and much more.
</p>
</div>
<div id="theSiglerverse" class="idScroll"><br></div>
<div class="backgroundImageContainer junkies idScroll">
<h2 class="under1200">The Siglerverse</h2>
<div class="centerPic">
<img src="images/BookShelf_Med.JPG" alt = "bookshelf" class="backgroundImage">
</div>
<div class="onTop">
<h3 class="over1200">The Siglerverse</h3>
<p>
Scott has written several series. Most of his series are within a single story universe, affectionately know as the "<span class="bold italics">Siglerverse</span>," which is comprised of 3 main eras:
<ol>
<li>The <span class="bold" style="font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif">Modern Era</span>: Books that take place in the present (by publication date).</li>
<li>The <span class="bold theGFL" style="font-family:MarsPolice">GFL Era</span>: Comprised of the Crypt and the Galactic Football League series, it takes place 500-700 years in the future.</li>
<li>The <span class="bold" style="font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif ">Generations Era</span>: takes place some 1800+ years into the future.</li>
</ol>
</p>
<p>
As the <span class="bold italics"> Siglerverse</span> books are all wound around one central universe, it's always fun to see Easter Eggs, and foreshadowing from books span across his various series. You'll see things in <span class="italics">Infected</span> that won't show up again until the GFL series. Or the <span style="font-family:Wanted; color:purple;" class="theGFL">Galactic Football League</span> using technology that was invented by <span class="italics">Earthcore.</span>
</p>
</div>
</div>
<p>
The timing (and reading order) of the stories in the Siglerverse (and his other stories) can be found on the <a href="http://siglerpedia.scottsigler.com/index.php/Sigler_Universes#Kissyman_Era">Siglerpedia Sigler Universes page.</a>
</p>
<div>
<h3 id="otherMedia" class="idScroll">Outside The Siglerverse</h3>
<img alt="Aliens" class="aliens" src="images/small/books/AliensPhalanx_HC.jpg">
<p>
He has also produced content for the "Aliens" universe, with a novel, and two short stories, one of which was the very first story written from a Xenomorph's point of view!
</p>
<p>
Scott effortlessly blends science fiction (with a hard science), and elements horror. His novels tend to be a perfect blend of the two, with the thriller and horror elements having a solid foundation in science, Scott has an assemblage of PHD and other experts in their fields at his disposal whenever he needs them for story elements.
</p>
</div>
</div>
</div>
<!-- ================================ Footer ================================ -->
<footer>
<div class="footerLine orangeLink">
<div><br>
<details>
<summary>Page Credits</summary>
Page by Kurt Armbruster. <br>
Photos by Kurt Armbruster unless indicated otherwise.<br>
Siglerfest Junkie group photo and Scott Sigler promo photo from <a href="http://scottsigler.com">http://scottsigler.com</a> used with permission.<br>
Social Media and Retail Icon sources: <a href="https://www.picmonkey.com/graphics/social-media-icons">PicMonkey</a> and <a href="https://www.nicepng.com/">NicePNG</a>.
</details>
</div>
</div>
</footer>
</body>
</html>