-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathquotes.html
80 lines (73 loc) · 3.29 KB
/
quotes.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="css/style.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<meta name="description" content="Home of Aris Karatarakis, personal playground and log log" />
<meta property="og:url" content="https://www.indvstry.com">
<title>INDVSTRY · playground and log</title>
</head>
<body>
<!-- header -->
<header>
<!-- <nav>
<ul>
<li>Home</li>
<li>Articles</li>
<li>About</li>
</ul>
</nav> -->
<div class="header-text">
<h1>
Quotes of interest, A Collection
</h1>
</div>
</header>
<main>
<section class="quotes">
<!-- Sources
- https://alistapart.com/blog/post/more-thoughts-about-blockquotes-than-are-strictly-required/
- https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blockquote
-->
<!-- Encoding Notes
- use `@cite` This attribute is intended to point to information explaining the context or the reference for the quote.
- use `<cite>` element only for “works” (books, articles, etc). see: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/cite
- the citation doesn’t belong inside the blockquote ; according to the specification, the only content that can live inside a blockquote is the text being quoted.
- a semantic element to wrap this pattern (quote and citation) is the `<figure>` element
-->
<figure class="quote">
<blockquote cite="https://www.gutenberg.org/files/74/old/orig74-h/p1.htm#:~:text=work%20consists%20of%20whatever%20a%20body%20is%20obliged%20to%20do%2C%20and%20that%20play%20consists%20of%20whatever%20a%20body%20is%20not%20obliged%20to%20do.">
<p>Work consists of whatever a body is OBLIGED to do, and that Play consists of whatever a body is not obliged to do.</p>
</blockquote>
<figcaption><p class="quote-citation">Mark Twain, <cite><a href="https://www.gutenberg.org/files/74/old/orig74-h/p1.htm">The Adventures of Tom Sawyer</a></cite></p></figcaption>
</figure>
<figure class="quote">
<blockquote cite="https://www.huxley.net/bnw/four.html">
<p>Words can be like X-rays, if you use them properly—they’ll go through anything. You read and you’re pierced.</p>
</blockquote>
<figcaption><p class="quote-citation">Aldous Huxley, <cite>Brave New World</cite></p></figcaption>
</figure>
</section>
<section class="social">
<h2>Find me on:</h2>
<ul class="socialLinks">
<li>
<a href="https://www.linkedin.com/in/ariskaratarakis/" title="My LinkedIn Profile">LinkedIn</a>
</li>
<li>
<a href="https://twitter.com/INDVSTRY" title="Find me on twitter">Twitter</a>
</li>
<li><a href="https://glitch.com/@indvstry">Glitch</a></li>
<li><a href="https://github.com/indvstry">Github</a></li>
<li><a href="https://www.instagram.com/indvstry/">Instagram</a></li>
</ul>
</section>
</main>
<footer>
<p>Handcrafted with ❤️️️ 2019 • 2023</p>
</footer>
<!-- <script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script> -->
</body>
</html>