-
Notifications
You must be signed in to change notification settings - Fork 0
/
pronounsPageOne.html
108 lines (92 loc) · 4.16 KB
/
pronounsPageOne.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
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Ribeye+Marrow:wght@400&display=swap"
data-tag="font"
/>
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Darker+Grotesque:wght@300;400;500;600;700;800;900&display=swap"
data-tag="font"
/>
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Varela+Round:wght@400&display=swap"
data-tag="font"
/>
<link rel="stylesheet" href="pronounsPageOne.css">
</head>
<body>
<nav class="navbar" id = "navbar">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="index.html">
<button class = "home navbar-btn">
<img
src="icon4173-2yo-200w.png"
alt="icon4173"
class="dashboard-icon"
/><div class = "home-text">PRISM</div></button></a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li><a href="pronounsPageOne.html"><button class = "navbar-right-btn navbar-btn">pronouns</button></a></li>
<li><a href="identities.html"><button class = "navbar-right-btn navbar-btn">identities</button></a></li>
<li><a href="chat.html"><button class = "navbar-right-btn navbar-btn">askPossum</button></a></li>
<li><a href="news.html"><button class = "navbar-right-btn navbar-btn">news</button></a></li>
<li><a href="about.html"><button class = "navbar-right-btn navbar-btn">about</button></a></li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div class = "row">
<div class = "container">
<div class = "col-sm-12 about-pronouns">
<p><h2 style="font-weight: 650">What are pronouns?</h2></p>
<p style="margin-left: 10px; margin-right: 10px; margin-bottom: 15px;">Pronouns are used in place of a proper noun. Common pronouns include he, she, and they.
Neopronouns such as ze, ze, and fae are also pronouns. Neopronouns include pronouns besides the ones most commonly used in our language.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-5">
<div class = "pronoun-chart-purple">
<img src = "pronounchartfull18526-iwot-600w.png" width = 90%>
</div>
</div>
<div class="col-sm-7">
<div class="description-yellow">
<p><h2 style="font-weight: 650">Do I need to memorize all the pronouns?</h2></p>
<p style="margin-left: 10px; margin-right: 10px; margin-bottom: 15px;">No, not at all! There are a ton of neopronouns people use to
describe themselves, & these pronouns are what feel the most
comfortable and representative of them. A good rule of thumb for
deciding which neopronouns to learn is to practice the more common
ones (chart on the left) and learn the pronouns of the people
around you. If someone tells you their pronouns and you are
unfamiliar with them, it's a good idea to practice them!</p>
<a href = "pronouns.html"><a href="pronouns.html">
<button class="practice-btn">
<span style="vertical-align: text-top;">Practice!</span>
</button>
</a>
<p style="margin-left: 15px; margin-right: 15px; margin-bottom: 15px;">Click on the button to practice using pronouns & neopronouns!</p>
</div>
</div>
</div>
</div>
</body>
</html>